1

我确信这可能并不难做到，但我对 Javascript 的经验不是很丰富，并且真的可以使用一些指针！

我已经在我的网站上实现了 NIVO LIGHTBOX http://dev7studios.com/plugins/nivo-lightbox/（由 Nivo Slider 的同一制造商），现在想要为此插件启用触摸/滑动手势，以便有人可以导航，如果他们在 ipad/iphone 等设备上访问我的网站。

1）我应该使用什么触摸库？似乎有很多，我不确定哪个最好或最容易使用？我只想拥有单指、左右滑动功能进行导航。激活导航的最小滑动（即 50 像素）可能也是一个好主意。

2）我需要在标题中放入什么？（如果可以的话，请提供一些特定的代码来帮助我）。我假设我需要： - 链接到插件（我可以这样做） - 触发触摸手势需要什么代码？

3) 我如何将灯箱的 DIV 或 IMG 标签链接到它以使其工作？

4）理想情况下，如果检测到触摸设备，我还想隐藏导航箭头？

我的网站在这里： http: //www.sandbox.imageworkshop.com/projects/william-angliss-institute/

非常感谢您的帮助。

4

1 回答 1

3

这种方法对我有用：http ://www.janes.co.za/easy-ipad-gestures-in-your-website-with-jquery/

下面是我添加到我的 Functions.php 以添加必要的 javascript 的代码：

function child_theme_head_script() { 
?>      
<script src="<?php bloginfo('stylesheet_directory') ?>/js/jquery.touchwipe.min.js"></script>

<script>    
    jQuery(document).ready(function(){
        jQuery('body').touchwipe({
            wipeLeft: function(){ jQuery(".nivo-lightbox-next").click(); },
            wipeRight: function(){ jQuery(".nivo-lightbox-prev").click(); },
             min_move_x: 20,
             min_move_y: 20,
             preventDefaultEvents: false
        })
    });
    </script>
<?php 
}
add_action( 'wp_head', 'child_theme_head_script' );
于 2013-11-24T08:35:35.523 回答