PhotoSwipe,页眉和页脚菜单

时间:2013-04-01 16:48:44

标签: jquery html5 swipe

我尝试为移动设备制作照片库。而我想要做的就是点击触摸屏打开页眉和页脚工具栏,因为它们有按钮可以共享并返回到另一页。

但是我无法选择按钮,

当我点击页眉和页脚时,我只能向右和向左滑动。

有人可以帮我吗?

HTML5代码:

<div data-role="page">
    <div data-role="header" id="header" data-position="fixed" data-fullscreen="true">
        <a href="Revista.html" class="ui-btn-left" data-direction="reverse" data-icon="home" data-iconpos="notext" data-inline="true" data-role="button" data-theme="a"></a>
        <h1>HOME</h1>
    </div>


<div data-role="content" id="f">

<ul id="Gallery" class="gallery">

        <li><a href="img/image001.jpg"></a></li>

    </ul>
</div>

<div data-role="footer" data-position="fixed" data-fullscreen="true">
      <ul class="social-likes" id="s">
            <li class="facebook" title="Facebook">Likes</li>
            <li class="twitter" title="Twitter">Twitter</li>
            <li last-option id="nomecontacto"><a href="#" onclick="showForm()" title="Enviar Mensagem">Contacto<img src="img/mail-icon.png"/></a></li>
    </ul>
</div> 


</div><!--rolepage-->

</div>

JAVASCRIPT:

<script type="text/javascript">

        (function(window, PhotoSwipe){

            document.addEventListener('DOMContentLoaded', function(){

                var
                    options = {
                        preventHide: true,
                                    },
                    instance = PhotoSwipe.attach( window.document.querySelectorAll('#Gallery a'), options );

                    instance.show(0);

            }, false);


        }(window, window.Code.PhotoSwipe));

    </script>

0 个答案:

没有答案