0

私は最初のライトボックスシステムを使用しています。ファンシーボックスを選びました。しかし、私には問題があります。クリック後にギャラリーの画像を選択すると、画像が非表示になります。

これは私のすべてのコードです。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
    <title>FancyBox Gallery Test</title>

    <link rel="stylesheet" href="inc/css/style.css" />
    <link rel="stylesheet" href="inc/js/fancybox/jquery.fancybox.css" />
    <link rel="stylesheet" href="inc/js/fancybox/helpers/jquery.fancybox-buttons.css" />
    <link rel="stylesheet" href="inc/js/fancybox/helpers/jquery.fancybox-thumbs.css" />
    <script type="text/javascript" src="inc/js/jquery.js"></script>
    <script type="text/javascript" src="inc/js/jquery.mousewheel.js"></script>
    <script type="text/javascript" src="inc/js/fancybox/jquery.fancybox.js"></script>
    <script type="text/javascript" src="inc/js/fancybox/helpers/jquery.fancybox-buttons.js"></script>
    <script type="text/javascript" src="inc/js/fancybox/helpers/jquery.fancybox-media.js"></script>
    <script type="text/javascript" src="inc/js/fancybox/helpers/jquery.fancybox-thumbs.js"></script>
</head>
<body>

    <div class="gallery">
        <center>
        <script type="text/javascript">
            $(document).ready(function(){

                for(var i = 0;i<9;i++){
                    $(".gallery li#"+i).fancybox({
                        padding: 0,
                        'hideOnContentClick': false,
                        openEffect : 'elastic',
                        openSpeed  : 150,

                        closeEffect : 'elastic',
                        closeSpeed  : 150,

                        closeClick : true,

                        helpers : {
                            overlay : null
                        }
                    });
                }
            });
        </script>
        <ul>
            <li id="1"><img src="inc/imj/uye/Mustafa AY/1.jpg" alt="123123123" /></li>
            <li id="2"><img src="inc/imj/uye/Mustafa AY/1.jpg" alt="" /></li>
            <li id="3"><img src="inc/imj/uye/Mustafa AY/1.jpg" alt="" /></li>
            <li id="4"><img src="inc/imj/uye/Mustafa AY/1.jpg" alt="" /></li>
            <li id="5"><img src="inc/imj/uye/Mustafa AY/1.jpg" alt="" /></li>
            <li id="6"><img src="inc/imj/uye/Mustafa AY/1.jpg" alt="" /></li>
            <li id="7"><img src="inc/imj/uye/Mustafa AY/1.jpg" alt="" /></li>
            <li id="8"><img src="inc/imj/uye/Mustafa AY/1.jpg" alt="" /></li>
        </ul>
        </center>
    </div>
</body>
</html>

どのように解決しますか？なぜなら、私は間違って見ることができないからです。

ご関心をお寄せいただきありがとうございます。よくやった..

4

1 に答える 1

0

私はあなたの問題が何であるかを理解したと思います. 私はそれを少し片付けました、そして私はあなたの問題を解決したことを願っています:)

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
    <title>FancyBox Gallery Test</title>

    <link rel="stylesheet" href="inc/css/style.css" />
    <link rel="stylesheet" href="inc/js/fancybox/jquery.fancybox.css" />
    <link rel="stylesheet" href="inc/js/fancybox/helpers/jquery.fancybox-buttons.css" />
    <link rel="stylesheet" href="inc/js/fancybox/helpers/jquery.fancybox-thumbs.css" />
</head>
<body>

    <div class="gallery" style="text-align:center;">
        <ul>
            <li><a class="fancybox" rel="gallery1" href="inc/imj/uye/Mustafa AY/1.jpg" title="Image 1: Title"><img src="inc/imj/uye/Mustafa AY/1.jpg" /></a></li>
            <li><a class="fancybox" rel="gallery1" href="inc/imj/uye/Mustafa AY/1.jpg" title="Image 2: Title"><img src="inc/imj/uye/Mustafa AY/1.jpg" /></a></li>
            <li><a class="fancybox" rel="gallery1" href="inc/imj/uye/Mustafa AY/1.jpg" title="Image 3: Title"><img src="inc/imj/uye/Mustafa AY/1.jpg" /></a></li>
            <li><a class="fancybox" rel="gallery1" href="inc/imj/uye/Mustafa AY/1.jpg" title="Image 4: Title"><img src="inc/imj/uye/Mustafa AY/1.jpg" /></a></li>
            <li><a class="fancybox" rel="gallery1" href="inc/imj/uye/Mustafa AY/1.jpg" title="Image 5: Title"><img src="inc/imj/uye/Mustafa AY/1.jpg" /></a></li>
            <li><a class="fancybox" rel="gallery1" href="inc/imj/uye/Mustafa AY/1.jpg" title="Image 6: Title"><img src="inc/imj/uye/Mustafa AY/1.jpg" /></a></li>
            <li><a class="fancybox" rel="gallery1" href="inc/imj/uye/Mustafa AY/1.jpg" title="Image 7: Title"><img src="inc/imj/uye/Mustafa AY/1.jpg" /></a></li>
            <li><a class="fancybox" rel="gallery1" href="inc/imj/uye/Mustafa AY/1.jpg" title="Image 8: Title"><img src="inc/imj/uye/Mustafa AY/1.jpg" /></a></li>
        </ul>
    </div>

    <script type="text/javascript" src="inc/js/jquery.js"></script>
    <script type="text/javascript" src="inc/js/jquery.mousewheel.js"></script>
    <script type="text/javascript" src="inc/js/fancybox/jquery.fancybox.js"></script>
    <script type="text/javascript" src="inc/js/fancybox/helpers/jquery.fancybox-buttons.js"></script>
    <script type="text/javascript" src="inc/js/fancybox/helpers/jquery.fancybox-media.js"></script>
    <script type="text/javascript" src="inc/js/fancybox/helpers/jquery.fancybox-thumbs.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){

            $(".fancybox").fancybox({
                padding: 0,
                openEffect : 'elastic',
                openSpeed  : 150,

                closeEffect : 'elastic',
                closeSpeed  : 150,

                closeClick : false,

                helpers : {
                    overlay : null
                }
            });
        });
    </script>
</body>
</html>
于 2013-08-30T11:41:34.167 に答える