Question

我确信这可能不难做到，但我对Javascript不是很有经验，可以使用一些指针！

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

1）我应该使用哪种触控库？似乎有很多，我不确定哪一个最好或最容易使用？我只想要单指，左右滑动功能进行导航。最小滑动（即50px）以激活导航也是一个好主意。

2）我需要在标题中添加什么？（如果可以的话，请提供一些具体的代码来帮助我）。我假设我需要： - 链接到插件（我很好，如何做到这一点） - 触发触摸手势需要什么代码？

3）如何将灯箱的DIV或IMG标签链接到它？

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

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

非常感谢你的帮助。

Answer 1

这种方法对我有用：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' );

将SWIPE功能添加到LIGHTBOX？

1 个答案: