0

私は昨日redditで素敵な人がプレゼントしたこの無料のテンプレートでfancyboxを動作させようとしていましたが、あまり運がありません。私はHTML/CSSはまともですが、Jqueryはあまり得意ではありません。誰かが私を正しい方向に向けることができれば、私はそれをいただければ幸いです。ポートフォリオ画像をファンシーボックスに表示しようとしています。 http://jsfiddle.net/yz93H/1/ 助けてくれてありがとう。

 <script type="text/javascript">
  $(document).ready(function() {
   $("a.fancybox").fancybox();
   });
    </script>


   <figure class="entry web"> 
                <a class="fancybox" href="img/portfolio-image.jpg"><img src="img/portfolio-image.jpg" alt=""></a>
            </figure> 
4

1 に答える 1

1

あなたが投稿したjsfiddleは、すべての相対パスのために操作するのが少し難しいですが、それでも、私が気付いた1つのことは、Fancyboxjavascriptをドキュメントにリンクしていないことです。

次のようなものがあるはずです:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>`
<script type="text/javascript" src="/fancybox/jquery.fancybox-1.3.4.pack.js"></script>`

うまくいけば、それはそれを修正します。

編集:申し訳ありませんが、ドキュメントの最後にあなたのjsを逃しました。もう一度見てみると、あなたの問題が見つかりました。投稿したスニペットは、 jQueryが読み込まれた後に表示されます。jQueryはドキュメントの最後にのみ読み込まれるため、コードはをスローしてObject #<HTMLDocument> has no method 'ready'いました。

あなたが投稿したものの作業バージョンを使用して、新しいフィドルを作成しました。すべてがCDNから読み込まれ、Twitterのロゴをショーケースとして使用しました:http://jsfiddle.net/tiagoespinha/yz93H/4/

基本的に、必要な変更はこれを置くことだけです

<script type="text/javascript">
    $(document).ready(function() {
        $("a.fancybox").fancybox();
    });
</script>

jQueryのスクリプトタグの後。

于 2012-11-09T15:30:16.620 に答える