jQuery在计算机上工作但在iPad上没有?

jQuery在计算机上工作但在iPad上没有?,第1张

概述以下代码: if(!$($texte).parent().hasClass('text-bg')) $texte = $($texte).parent(); if($($texte).hasClass('text-left')){ flag = $texte.data('animToggle'); 以下代码:

if(!$($texte).parent().hasClass('text-bg'))                $texte = $($texte).parent();            if($($texte).hasClass('text-left')){                flag = $texte.data('animToggle');                $texte.data('animToggle',!flag);                $texte.animate({                    'left': flag ? '-48%' : '0'                })            }            if($($texte).hasClass('text-right')){                flag = $texte.data('animToggle');                $texte.data('animToggle',!flag);                $texte.animate({                    'right': flag ? '-48%' : '0'                })            }

一切都在计算机上正常工作.问题如下:在我的iPad上,左边的动画完美无瑕,但正确的动画错误.当我第一次点击它时,它就会跳出来.在第二次单击使div再次生成动画时,它动画就好了.这些的CSS只适用于左边的一个:position:absolute;左:-48%;右边刚刚右转:-48%.

那么我做错了什么?

先感谢您

http://jsfiddle.net/46bu6orf/

!更新:! TrueBlueAussIE的解决方案与我的改变相结合现在起作用:

$(document).on('click',function (event) {    var $texte = $(event.target);    // Find the closest slIDing container to the item clicked (match either class)    var $bar = $texte.closest('.text-right,.text-left');    // Get the animation open/closed flag    var flag = $bar.data('animToggle');    // toggle the animation flag and store it    $bar.data('animToggle',!flag);    // If this is a left bar animate left edge    if ($bar.hasClass('text-left')) {        flag ? $bar.CSS('left','-52%') : $bar.CSS('left','0');    // Reverse flag for left to show correct < >    flag = !flag;    }    // If this is a right bar animate right edge    if ($bar.hasClass('text-right')) {        flag ? $bar.CSS('right','-52%') : $bar.CSS('right','0');    }    // Toggle the < > display    var $span = $bar.find('.pfeil');    $span.HTML(flag ? '<' : '>');});

似乎.animate’right’属性在iPad上有一个错误.通过使用jquery的.CSS并向容器添加转换,它可以工作.

解决方法 这不是最终答案,因为需要更多信息,但这里有太多的信息可供评论.有很多问题我做了一个完整的重写,以简化代码并理解发生了什么.

我还修改了HTML和样式,以便左右面板同时可用.

到目前为止的结果如下:http://jsfiddle.net/TrueBlueAussie/46bu6orf/18/

$(document).on('click',!flag);    // If this is a left bar animate left edge    if ($bar.hasClass('text-left')) {        $bar.animate({            'left': flag ? '-48%' : '0'        })        // Reverse flag for left to show correct < >        flag = !flag;    }    // If this is a right bar animate right edge    if ($bar.hasClass('text-right')) {        $bar.animate({            'right': flag ? '-48%' : '0'        })    }    // Toggle the < > display based on the open/closed flag    var $span = $bar.find('.pfeil');    $span.HTML(flag ? '<' : '>');});

这可以进一步简化,但很快你就不会认出它了:)

我立刻注意到这款造型与我的iPhone不兼容,这表明我的iPad不会更好.我稍后会调查并更新我的发现.我希望上面的例子至少能为其他人提供一个更好的起点

总结

以上是内存溢出为你收集整理的jQuery在计算机上工作但在iPad上没有?全部内容,希望文章能够帮你解决jQuery在计算机上工作但在iPad上没有?所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1079423.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-27
下一篇 2022-05-27

发表评论

登录后才能评论

评论列表(0条)

保存