jQuery文本横向滚动效果的实现代码

许多网站都有公告栏,它们都喜欢以水平滚动的方式显示,最近我还用jQuery写了一个水平滚动条,实现了自定义滚动速度,鼠标通过时鼠标暂停的功能。

HTML代码如下所示:




jQuery文本横向滚动jQuery使文本水平滚动






JS代码:

方法1:


美元。FN。textscroll =函数(){

速度= 60,旗= null,TT,那(这),孩子=美元that.children();

无功p_w = that.width(),W = child.width();

Child.css({左:p_w });

var t =(W + p_w) /速度×1000;

函数播放(m){

var = m =未定义的t:m;

child.animate({左:w },TM,线性

美元(这个)。Css(左)

游戏();

});

}

Child.on({

Mouseenter:函数(){

var = $(this);

美元(这个);

TT =(-(-(-(- W-L) /速度)×1000;

},

Mouseleave:函数(){

游戏(TT);

未定义的;

}

});

游戏();

}


方法二:


美元。FN。textscroll =函数(){

var = $(this),

C = p.children(),

速度= 3000;值越大,速度越小。

无功连续= c.width(),PW = p.width();

var =(CW 100)*速度;

var = NULL,t1 = 0;

功能肛门(TM){

counttime();

c.animate({左:连续波},TM,线性

C.css({左:PW });

ClearInterval(F);

t1=0;

T =(((CW + PW) / 100)*速度;

肛门(T);

});

}

功能counttime(){

F = setInterval(){()函数(

t1=10;

},10);

}

P.on({

Mouseenter:函数(){

C.stop(假的,假的);

ClearInterval(F);

console.log(T1);

},

Mouseleave:函数(){

肛门(T - T1);

console.log(T1);

}

});

肛门(T);

}


最后一个电话是$(# s)TextScroll();

上述jQuery文本横向滚动效果的实现代码,萧边分享了你的全部内容。我希望能给你一个参考,希望你能支持它。