Question

我想使用jQuery Touch Punch插件来实现以下效果：

我有一个Div，只在我的iPad屏幕左侧显示一点点。现在我想使用jQuery Touch Punch将其拉出来。我似乎无法找到如何限制属性，因此我可以编写如下内容：

left-keyframe1：0; left-keyframe2：-48％;

我希望你明白这个主意。另外，当我退出时，我希望它能够在你没有超过50％的时候动画回来。有关于此的一些文件吗？我似乎无法找到这个。我浏览了这个网站上的所有例子：

http://touchpunch.furf.com/

提前致谢！

Answer 1

我找到了解决方案：

$('.your-div').draggable(
        {
            scroll: false,
            start:function(){$startpos = $(this).position();$(this).css({'transition':'0','-webkit-transition':'0'});},
            stop:function(){
                $position = $(this).position();
                if($position.left > $startpos.left)
                {
                    $(this).animate({'left':'0'});
                }
                else
                {
                    $(this).animate({'left':'-52%'});
                }
               $(this).css({'transition':'youramounts','-webkit-transition':'youramounts'});
            },
                axis:'x'
            });

注意：我添加了transition:0，因为我有两个eventtriggers并且转换与dragfunction冲突。点击和拖动。所以点击我改变了css并通过转换做了一个动画。如果你没有＆＃34;过渡＆＃34;在你的元素上，你不需要包含它。

jQuery UI Touch Punch设置左css？

1 个答案: