在jquery mobile中使用Photoswipe打开画廊答案

【问题标题】：Photoswipe opening gallery in jquery mobile在jquery mobile中使用Photoswipe打开画廊
【发布时间】：2012-12-04 13:29:24
【问题描述】：

所以我正在使用 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>

知道我应该怎么做吗？

【问题讨论】：

标签： jquery html jquery-mobile photoswipe

【解决方案1】：

尝试删除

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

我认为这是在您调用 $("#gallery a").photoSwipe 初始化后调用画廊

【讨论】：

太好了，一切正常。我只是不确定为什么默认调用不起作用？这是调用 $(document).ready(function(){ var myPhotoSwipe = $("#Gallery a").photoSwipe({ enableMouseWheel: false , enableKeyboard: false });