大佬教程收集整理的这篇文章主要介绍了jQuery.ScrollTo / jQuery.SerialScroll水平滚动,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我在this post讨论时,目前正在使用liScroll进行连续水平滚动.
但是,现在我需要离散滚动,我使serialScroll完美地适用于垂直滚动.
出于某种原因,如果’axis’@L_607_4@被指定为’x’,则不会发生任何事情.
我甚至无法让SerialScroll example for right to left scrolling工作.
我有像这样的HTML:
<div id="pane"> <div>Item 1</div> <div>Item 2</div> <div>Item 3</div> </div>
我有这样的jQuery,当轴为’y’时有效
jQuery(function($) { var $pane = $('#pane'); $pane.serialScroll({ items: 'div',next: $pane,// the container itself will get bound duration: 2100,force: true,axis: 'x',step: 1,//scroll 1 news each time event: 'shownext' //just a random event name }); seTinterval(function() {//scroll each 12 seconds $pane.trigger('shownext'); },12000); });
有任何想法吗?
//编辑(接受答案)
对于那些出现的人来说,接受的答案摆脱了对“serialScroll”的需要(只需要scrollTo).高度不是必需的.一定要将$(‘scroller’)更改为$(‘mywrap’)或$(target.parent().parent()).您还可以像这样设置自动滚动:
var index = 2; seTinterval(function() {//scroll each 5 seconds index = index > $('#news ul li').length ? 1 : index; sliderScroll($('#news ul li:nth-child(' + index + ')')); index ++; },5000);
将#news ul li替换为适当的选择器.
这是我采取的步骤:
>将包含div设置为我希望滑块显示为的尺寸.溢出:汽车;有助于测试,但你可能想要使用overflow:隐藏到最后.
>在那里放置另一个div,使它足够大,可以水平放置所有元素.
>浮动面板.给他们明确的维度.
我的CSS:
.scroller{ position: relative; overflow: hidden; height: 410px; width: 787px;} .modal-content{width: 3400px;} .modal-content div{float:left; width:728px; height: 405px; padding: 0 30px;}
我的JS:
function sliderScroll(target){ if(target.length <1)return false; $(".current").removeClass("current"); target.addClass("current"); $(".scroller").scrollTo(target,500,{axis:'x'}); return false; }
我的HTML:
<div class="scroller"> <div class="modal-content"> <div>...</div> ... </div> </div>
以上是大佬教程为你收集整理的jQuery.ScrollTo / jQuery.SerialScroll水平滚动全部内容,希望文章能够帮你解决jQuery.ScrollTo / jQuery.SerialScroll水平滚动所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。