在jquery mobile中的Photoswipe开放画廊

时间:2012-12-04 05:13:34

标签: jquery html jquery-mobile photoswipe

因此我正在使用Jquery Mobile和photoswipe为一个投资组合创建一个小图库,但是一旦我调用了photoswipe,它就会立即在浏览器中打开图库。它不是来自photoswipe网站的默认电话,因为它不起作用。

继承我的代码。

 <!DOCTYPE html>
<html>
<head>

    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" />
    <meta name="apple-mobile-web-app-capable" content="yes" />


    <link rel="stylesheet" type="text/css" href="jquery-mobile/jquery.mobile.structure.css">
    <link rel="stylesheet" type="text/css" href="jquery-mobile/jquery.mobile.css">
    <link rel="stylesheet" type="text/css" href="jquery-mobile/jquery.mobile.theme.css">
    <link rel="stylesheet" type="text/css" href="jquery-mobile/photoswipe.css">



    <script type-"text/javascript" src="jquery-mobile/jquery.js"></script>
    <script type-"text/javascript" src="jquery-mobile/jquery.mobile.js"></script>
    <script type="text/javascript" src="jquery-mobile/klass.min.js"></script>
    <script type="text/javascript" src="jquery-mobile/code.photoswipe.jquery-3.0.5.js"></script>

    <script type="text/javascript">

        (function(window, $, PhotoSwipe)
        {
            $(document).ready(function()
            {
                $("#gallery a").photoSwipe(
                {
                    enableMouseWheel: false,
                    enableKeyboard: false
                });

                $("#gallery a:first").click();
            });
        }(window, window.jQuery, window.Code.PhotoSwipe));

    </script>

</head>
<body>

<div data-role="page">

    <div data-role="header">
    <h1>welcome</h1>
    </div>

    <div id="gallery">


            <a href="web/full/photo1.jpg" rel="external"><img src="web/thumb/photo1thumb.jpg" alt="Image 001" /></a>
            <a href="web/full/photo2.jpg" rel="external"><img src="web/thumb/photo2thumb.jpg" alt="Image 002" /></a>
            <a href="web/full/photo3.jpg" rel="external"><img src="web/thumb/photo3thumb.jpg" alt="Image 003" /></a>
            <a href="web/full/photo4.jpg" rel="external"><img src="web/thumb/photo4thumb.jpg" alt="Image 004" /></a>
            <a href="web/full/photo5.jpg" rel="external"><img src="web/thumb/photo5thumb.jpg" alt="Image 005" /></a>
            <a href="web/full/photo6.jpg" rel="external"><img src="web/thumb/photo6thumb.jpg" alt="Image 006" /></a>


    </div>

    <div data-role="footer">
    <h2>2012</h2>
    </div>
</div>  

</body>
</html>

我应该怎么做?

1 个答案:

答案 0 :(得分:0)

尝试删除

$("#gallery a:first").click();

我认为这是在您通过调用$("#gallery a").photoSwipe

初始化后调用图库