3

Fancyboxを機能させることができないようです-それは最初の写真にリンクしているだけです。エラーが発生します：キャッチされていないtypeerrorオブジェクト＃オブジェクトにはメソッド'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の開発者ツールのソースによると、外部ファイルを取得しているようです。

どうも

4

4 に答える 4

4

うーん。jquery が 2 回読み込まれているようです。一度

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

もう1つは（見つけるのが難しい）

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

drupal を使用しているようで、少しグーグルで調べてみると、jquery のバージョンが挿入されているようです (jQuery JavaScript ライブラリ v1.3.2)。

エラーが発生している理由は、2 つのライブラリ間の競合です。この更新に従ってみてください http://drupal.org/project/jquery_update

于 2013-01-04T19:46:02.330 に答える
2

2 つのバージョンの jQuery を取り込みます。

jQuery(".fancybox").jqueryコンソールから実行すると、 1.3.2. 間違いなく、これは fancybox と互換性がありません。

jQuery 1.8.2 は、明示的なscriptタグ リクエストを使用して Google CDN 経由で読み込まれます。

jQuery 1.3.2 は の一部としてロードされhttp://staging.timeoutchicago.com/sites/timeoutchicago.com/files/advagg_js/js_13ec2e29dba08b369ccfdde54d836ec0_8.jsます。これは、Drupal が独自の目的でこのライブラリを注入したことに由来します。

今後の参考のために、Chrome 開発者ツールを使用してこのファイルを見つけることができました。ファイル サイズ (最初に大きいもの) で並べ替えてから、JS ファイルを調べました。その後、すぐに見つかりました。

于 2013-01-04T19:45:43.243 に答える
-1

何かがうまくいかない場合：

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

この隠れファンシーボックス。

于 2014-11-24T08:41:30.873 に答える