首页 > 解决方案 > 自动滚动 Jquery 不适用于移动设备

问题描述

我有这个执行水平自动滚动的代码,我用它在水平放置的滑块中显示一些图像。

这是代码的示例。

该代码在台式机(PC)上完美运行,但是当我在手机上使用它时它不起作用。它卡住了,滚动不动。

问题是什么?

function animatethis(targetElement, speed) {
    var scrollWidth = $(targetElement).get(0).scrollWidth;
    var clientWidth = $(targetElement).get(0).clientWidth;
    $(targetElement).animate({ scrollLeft: scrollWidth - clientWidth },
    {
        duration: speed,
        complete: function () {
            targetElement.animate({ scrollLeft: 0 },
            {
                duration: speed,
                complete: function () {
                    animatethis(targetElement, speed);
                }
            });
        }
    });
};
animatethis($('#q1'), 5000);
#q1 { white-space: nowrap; overflow-y: scroll; }
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<div id="q1">((BEGIN)) Watch me Watch me Watch me Watch me Watch me Watch me Watch me Watch me Watch me Watch me Watch me Watch me Watch me Watch me Watch me Watch me Watch me Watch me Watch me Watch me Watch me Watch me Watch me Watch me Watch me Watch me Watch me Watch me Watch me Watch me Watch me Watch me Watch me Watch me Watch me Watch me Watch me Watch me ((END))</div>

标签: jqueryscroll

解决方案


推荐阅读