2017-04-20 66 views
0

我想在羽毛模态图像下添加标题。我尝试使用下面的代码来做到这一点,就像这里建议的其他许多帖子一样,但它不起作用。如何将标题/大拇指向上或向下添加到羽毛灯

$.featherlightGallery.prototype.afterContent = function() { 
      var caption = this.$currentTarget.find('img').attr('alt'); 
      this.$instance.find('.caption').remove(); 
      $('<div class="caption">').text(caption).appendTo(this.$instance.find('.featherlight-content')); 
    } 

相反,我在控制台得到了以下错误:

Uncaught TypeError: Cannot read property 'prototype' of undefined 
at main.js:62 

featherlight.min.js:8 Featherlight: no content filter found (no target specified) 

这里是我如何插入图片到我的网页。我的计划是在模态图像下面包括一个大拇指,我认为至少让alt标签正确显示将是一个很好的第一步。如果任何人都可以帮助插入一个链接/图像,而不是一个更好的alt标题!任何帮助是极大的赞赏!

JAVASCRIPT

function putImages(){ 

if (ajaxCall.readyState==4){ 

    if(ajaxCall.responseText){ 
     // to separate the file names, with semicolons 
     var resp = ajaxCall.responseText; 
     var files = resp.split(";"); 
     // check if string isn't empty and add a thumbnail 
     for(var i = 0; i < files.length; i++){ 

      if(files[i] != ""){ 

       document.getElementById("gallery").innerHTML += '<img class="myImg" src="/img/'+files[i]+'" width="198" height="198" alt="test" data-featherlight="/img/'+files[i]+'" />'; 
       picCount++; 

       } 
      } 
     } 
    } 
} 

HTML

<div class="container"> 
     <!-- Image Gallery --> 
     <div class="row"> 
     <div class="col-xs-12" id="gallery"> 

     </div> 
     </div> 
    </div> 

回答

0

该错误消息告诉你,$.featherlightGalleryundefined。你没有正确加载羽毛画廊,或者只是使用羽毛灯,那么这是你应该改变的选项。

+0

因此,我将'$ .featherlightGallery'改为'$ .featherlight',并得到类似的错误'Uncaught TypeError:无法读取未定义的属性'prototype'和'Featherlight:未找到内容过滤器(未指定目标) .'点击图片调出灯箱。灯箱似乎工作正常,所以我真的不知道这是最后一个错误是关于什么。我真正能看到的唯一问题是缺少标题。这可能是因为我没有使用''标签吗? – migs