jQuery.fancybox是未定义的;无法访问其“ jumpto”属性

时间:2018-12-07 16:56:46

标签: jquery undefined fancybox-2

我不断收到此“ TypeError:jQuery.fancybox未定义;每次单击带有fancybox jQuery插件的缩略图时都无法访问其“ jumpto”属性的错误。我试图解决jQuery冲突。我还做了一个基本测试,以验证是否存在“ Fancybox”。根据此测试,它是。我不知道发生了什么。

这是我的代码:

<a class="fancybox" href="http://farm6.staticflickr.com/5444/17679973232_568353a624_b.jpg"><img src="http://farm6.staticflickr.com/5444/17679973232_568353a624_m.jpg" alt=""/></a>

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/jquery.fancybox.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/jquery.fancybox.min.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/helpers/jquery.fancybox-buttons.css" />
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/helpers/jquery.fancybox-buttons.js"></script>

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/helpers/jquery.fancybox-media.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/helpers/jquery.fancybox-thumbs.css" />
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/helpers/jquery.fancybox-thumbs.js"></script>

<script type="text/javascript">
var jq = $.noConflict();
jq(document).ready(function() {
jq(".fancybox").click(function() {

   if(jq.fancybox) {
    alert("yes");
    } else {
    alert("no");
    }

   jq.fancybox.open([
        {
            href : 'http://farm6.staticflickr.com/5444/17679973232_568353a624_b.jpg',
            title : '1st title'
        },
        {
            href : 'http://farm6.staticflickr.com/5444/17679973232_568353a624_b.jpg',
            title : '2nd title'
        },
        {
            href : 'http://farm6.staticflickr.com/5444/17679973232_568353a624_b.jpg',
            title : '3rd title'
        }
    ], {
        nextEffect : 'none',
        prevEffect : 'none',
        padding    : 0,
        helpers    : {
            title : {
                type: 'over'  
            },
            thumbs : {
                width  : 75,
                height : 50,
                source : function( item ) {
                    return item.href.replace('_b.jpg', '_s.jpg');
                }
            }
        }
    });

    return false;
  });
});
</script>

0 个答案:

没有答案