gpt4 book ai didi

javascript - 使用滚动条自动水平滚动

转载 作者:行者123 更新时间:2023-11-28 02:47:45 24 4
gpt4 key购买 nike

我从 http://manos.malihu.gr/jquery-custom-content-scroller/ 安装了插件

我想使用自定义滚动条从左到右水平自动滚动来管理位置。这个插件对我有用,但我不能让他从左到右自动滚动。我已经完成了这段代码,但它有点问题

        var content=$("#content-1"),autoScrollTimer=2000,autoScrollTimerAdjust,autoScroll;

content.mCustomScrollbar({
axis:"x",
scrollButtons:{enable:true},
callbacks:{
whileScrolling:function(){
autoScrollTimerAdjust=autoScrollTimer*this.mcs.leftPct/100;
},
onScroll:function(){
if($(this).data("mCS").trigger==="internal"){AutoScrollOff();}
}
}
});

content.addClass("auto-scrolling-on auto-scrolling-to-right");
AutoScrollOn("right");

$(".auto-scrolling-toggle").click(function(e){
e.preventDefault();
if(content.hasClass("auto-scrolling-on")){
AutoScrollOff();
}else{
if(content.hasClass("auto-scrolling-to-top")){
AutoScrollOn("left",autoScrollTimerAdjust);
}else{
AutoScrollOn("right",autoScrollTimer-autoScrollTimerAdjust);
}
}
});

function AutoScrollOn(to,timer){
if(!timer){timer=autoScrollTimer;}
content.addClass("auto-scrolling-on").mCustomScrollbar("scrollTo",to,{scrollInertia:timer,scrollEasing:"linear"});
autoScroll=setTimeout(function(){
if(content.hasClass("auto-scrolling-to-top")){
AutoScrollOn("right",autoScrollTimer-autoScrollTimerAdjust);
content.removeClass("auto-scrolling-to-left").addClass("auto-scrolling-to-right");
}else{
AutoScrollOn("left",autoScrollTimerAdjust);
content.removeClass("auto-scrolling-to-right").addClass("auto-scrolling-to-left");
}
},timer);
}

function AutoScrollOff(){
clearTimeout(autoScroll);
content.removeClass("auto-scrolling-on").mCustomScrollbar("stop");
}

最佳答案

你只需要一个简单的 css 规则 overflow-x:scroll; ,不需要一些外部插件,

向我们展示您的 html 代码和 css 样式表,您需要为容器 div 设置此规则。

关于javascript - 使用滚动条自动水平滚动,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40828587/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com