javascript - 为什么 jQuery 效果在我的移动设备上不起作用，但在我的桌面上起作用

Question

这是我的 jQuery 代码:

$(document).ready(function(){

$('.get-btn').click(function(){
    $(this).parent().find('#get-btn').hide();
    $(this).parent().find('#install-btn').show('slide', {direction: 'right'}, 250);
});

$('#get_btn').click(function(){
    $(this).hide();
    $('#install_btn').show('slide', {direction: 'right'}, 250);
});

.show 与“幻灯片” 效果配合得很好。 在我的手机上打开页面时，“幻灯片”效果不起作用。 (“.show”工作正常..) 如何在我的手机上也启用“幻灯片”效果？

我的 html 代码中有这些标签:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/themes/smoothness/jquery-ui.css" />
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script>

Answer 1

获得更快的移动设备。

假设 jQuery 编程正确(我真的希望如此，但你永远不知道......)，它使用增量计时和 requestAnimationFrame 进行动画，这将使动画采取完全相同的方式时间量，与帧速率无关。但是，如果您的手机浏览器不能很好地跟上动画，您可能只会看到一个动画帧，看起来它不起作用。

另一个选择是让您的页面更加轻量级。 CSS 动画在大多数移动设备上运行得非常好，并且可以在没有 jQuery 开销的情况下进行控制。当然，这是以增加开发时间为代价的。