Fancybox將無法工作

似乎無法讓Fancybox工作 - 它只是鏈接到第1張圖片。我得到錯誤：uncaught typeerror object＃一個對象沒有方法'fancybox'。Fancybox將無法工作

HTML

<a class="fancybox" data-thumbnail="http://staging.timeoutchicago.com/sites/timeoutchicago.com/files/imagecache/timeout_slideshow_player_thumbnail/P1010923.JPG" href="http://staging.timeoutchicago.com/sites/timeoutchicago.com/files/imagecache/timeout_492x330/P1010923.JPG"><img alt="" src="http://staging.timeoutchicago.com/sites/timeoutchicago.com/files/toclogo.jpg"></a> 

<br /> 

<a class="fancybox" data-thumbnail="http://fancyapps.com/fancybox/demo/2_s.jpg" href="http://fancyapps.com/fancybox/demo/2_b.jpg"></a>

的Javascript

<script type="text/javascript"> 
    $(document).ready(function() { 
     $(".fancybox").attr('rel', 'gallery').fancybox({ 
      helpers: { 
       thumbs: { 
        width: 40, 
        height: 40, 
        source: function(current) { 
         return $(current.element).data('thumbnail'); 
        } 
       } 
      } 
     }); 
    }); 
</script>

頭

<!-- Add jQuery library --> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> 

<!-- Add fancyBox --> 
<link rel="stylesheet" href="/fancybox/source/jquery.fancybox.css?v=2.1.3" type="text/css" media="screen" /> 
<script type="text/javascript" src="/fancybox/source/jquery.fancybox.pack.js?v=2.1.3"></script>

它似乎在被拉動外部文件根據Chrome的開發者工具中的來源。

Thx

來源

2013-01-04 homersheineken

你能否提供此頁面的網址？ – Dancrumb

確定的事情：http://bit.ly/VAnpqb – homersheineken

@ user6347你不在你的頁面中添加插件。你添加的腳本只是「fancyBox的縮略圖助手」。 – Adrian

嗯。它看起來像jquery被加載兩次。一旦與

<!-- Add jQuery library --> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>

和其他（很難找到）

http://staging.timeoutchicago.com/sites/timeoutchicago.com/files/advagg_js/js_13ec2e29dba08b369ccfdde54d836ec0_8.js

它看起來像你使用Drupal和有位的谷歌搜索，它聽起來就像是注入一個版本的jQuery （jQuery JavaScript Library v1.3.2）

錯誤發生的原因是兩個庫之間的衝突。試試下面這個更新 http://drupal.org/project/jquery_update

來源

2013-01-04 19:46:02

我看到了，這就是爲什麼我找不到其他版本。我關閉了jquery_update模塊，現在它說我正在使用1.2.6版本。所以似乎advagg（這是必要的）將創建一些jQuery版本。有沒有辦法只使用更新的jQuery版本與Fancybox？ – homersheineken

好吧，我能夠壓制jquery的其他實例，所以它現在運行「1.8.2」。花式框仍然不會顯示。 – homersheineken

你有更新鏈接嗎？目前仍然顯示1.3注入 –

您正在使用jQuery的兩個版本。

當您從控制檯執行jQuery(".fancybox").jquery時，會得到1.3.2。毫無疑問，這與fancybox不兼容。

jQuery 1.8.2通過Google CDN通過您明確的script標記請求加載。

jQuery 1.3.2作爲http://staging.timeoutchicago.com/sites/timeoutchicago.com/files/advagg_js/js_13ec2e29dba08b369ccfdde54d836ec0_8.js的一部分加載，它來自Drupal爲了自己的目的而注入這個庫。

爲了將來的參考，我可以使用Chrome開發人員工具找到這個文件，按文件大小（最大的第一個）排序，然後查看JS文件......之後發現它很快。

來源

2013-01-04 19:45:43 Dancrumb

Thx。 Chrome工具上有哪些選項卡？我看了一下Sources並沒有看到排序的選項。 – homersheineken

網絡選項卡顯示資源大小 – Dancrumb

gracias dancrumb – homersheineken

-1

如果有什麼不工作：

parent.window.document.getElementById("fancybox-wrap").style.display = 'none';

這個隱藏的fancybox。

來源

2014-11-24 08:41:30 websky

我有這個同樣的問題，我通過在該行改變了雙引號解決它：

$(".fancybox").fancybox();

爲單引號：

$('.fancybox').fancybox();

排序的「疑難雜症」的的fancybox自網站有雙引號。

來源

2015-01-27 20:20:56

Fancybox將無法工作

回答

相關問題