js自动滑动+鼠标滑动区域 时间:2020-05-12 人气:0 <script language="javascript"> </script> 自动滑动+鼠标滑动区域 10秒自动跳转 热点聚焦 图说新闻 经济新闻 新闻1 新闻2 新闻3 <script language="javascript">fwdScroll();</script> 5秒自动跳转 财经要闻 财经观察 独家点评 湘股在线 财富排行榜 财经1 财经2 财经3 财经4 财经5 <script language="javascript">fecScroll();</script> ! 这个虽然效果不错,但是如果一个页面有多个这样的效果,就要针对每一部分写多个JS函数,那就太蠢了。其实只有控件名称不同而已,求高手改进成一个通用函数或者类来调用,不胜感激。 [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]这个虽然效果不错,但是如果一个页面有多个这样的效果,就要针对每一部分写多个JS函数,那就太蠢了。其实只有控件名称不同而已,求高手改进成一个通用函数或者类来调用,不胜感激 <script type="text/javascript"> /*栏目播放*/ var scrollNo=1; var SetTime=5*1000; var SetTimer; //clip:标签ID,box:版面ID,n:当前滑动项,m:滑动总数 function hideAllClips(clip,box,n,m) { for (i=1; i<(m+1); i++){ var allClips=box.toString()+i; var clipNum=clip.toString()+i; //alert("隐藏"+allClips); //if(i=n) break; document.getElementById(allClips).style.display="none"; document.getElementById(clipNum).className="topnavoff"; } } function clip_Switch(clip,box,n,m) { var curClip=box.toString()+n; var curClipNum=clip.toString()+n; //alert("当前"+curClip); hideAllClips(clip,box,n,m); document.getElementById(curClip).style.display="block"; document.getElementById(curClipNum).className="topnavon"; scrollNo=n; } function fwdScroll(clip,box,m) { stopScroll(); clip_Switch(clip,box,scrollNo,m); scrollNo+=1; if (scrollNo==m+1){ scrollNo=1; } SetTimer=setTimeout("fwdScroll('"+clip+"','"+box+"',"+m+")",SetTime); } function stopScroll() { clearTimeout(SetTimer); } --> </script> 自动滑动+鼠标滑动区域 热点聚焦 图说新闻 经济新闻 新闻1 新闻2 新闻3 <script language="javascript">fwdScroll('clipNum','newsbox',3);</script> 财经要闻 财经观察 独家点评 湘股在线 财富排行榜 财经1 财经2 财经3 财经4 财经5 <script language="javascript">fwdScroll('ecNav','ecBox',5);</script> 财经要闻 财经观察 独家点评 湘股在线 财富排行榜 财经1 财经2 财经3 财经4 财经5 <script language="javascript">fwdScroll('bcNav','bcBox',5);</script> ! 改了下,能够实现了,但是第二个为什么会默认第二个项开始,第三个从第三项开始呢?而且只有最后一个自动播放,前面的都死了;并且代码还是不够精练,请高手帮忙继续修改。 [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] <script type="text/javascript"> /*栏目播放*/ var scrollNo=0; var SetTime=5*1000; var SetTimer; function hideAllClips(clip,box,m) { for (i=1; i<(m+1); i++){ var allClips=box.toString()+i; var clipNum=clip.toString()+i; //alert("隐藏"+allClips); document.getElementById(allClips).style.display="none"; document.getElementById(clipNum).className="topnavoff"; } } function clip_Switch(clip,box,no,m) { var curClip=box.toString()+no; var curClipNum=clip.toString()+no; //alert("当前"+curClip); hideAllClips(clip,box,m); document.getElementById(curClip).style.display="block"; document.getElementById(curClipNum).className="topnavon"; scrollNo=no; } function fwdScroll(clip,box,m) { stopScroll(); clip_Switch(scrollNo); scrollNo+=0; if (scrollNo==m) { scrollNo=0; } SetTimer=setTimeout("fwdScroll(clip,box,m)",SetTime); } function stopScroll() { clearTimeout(SetTimer); } --> </script> 自动滑动+鼠标滑动区域 热点聚焦 图说新闻 经济新闻 新闻1 新闻2 新闻3 <script language="javascript">fwdScroll('clipNum','newsbox',3);</script> 财经要闻 财经观察 独家点评 湘股在线 财富排行榜 财经1 财经2 财经3 财经4 财经5 <script language="javascript">fwdScroll('ecNav','ecBox',5);</script> ! 改过以后不自动播放了。 [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] 加载全部内容