YTabs！多标签自动横向滚动新闻导航效果 |
| 2021-01-21 23:02:11 35资源网(www.35d.net) |
| js |
下载本资源原文网址：http://www.daima.org/js/js17405.html YTabs！多标签自动横向滚动新闻导航，一个很经典的标签导航效果，点击标签新闻滚动，可以设置自动滚动或手动滚动。ytabs.js中的moveElement方法来处理滚动效果。ytabs.js中还包含了YAO和tabView两个类，YAO是我根据YUI还有一些其他资源整理的一个常用方法类，采用单体模式。而tabView则是完全由我自己，也是这个AjaxTab效果的核心程序。
调用方法第一步：在页面中调用ytabs.js文件，例如：
<script type="text/javascript" src="js/ytabs.js"></script>
第二步：编写调用代码：
(function(){
YAO.YTabs({
tabs: YAO.getEl('photorecom-index').getElementsByTagName('a'),
contents: YAO.getEl('photorecom-list').getElementsByTagName('ul'),
scroll: true,
scrollId: 'photorecom-list',
scrollSpeed: 100, // 新闻滚动的速度，越小越快
direction: 'H', // 设置滚动方向： H - 横向 V - 纵向
defaultIndex: 2, // 设置默认显示第三屏新闻
auto: true, // 是否自动滚动
autoSpeed: 8000, // 每屏滚动的时间间隔
activeTag: 'UL', // 滚动一屏的HTML标签
evt:'click' // 鼠标点击标签滚动
});
})(); |
|
|
|
|
|
资源大全_资源下载网站：www.35d.net 本站资源仅限研究学习使用，如需商用请联系版权方， 本站事务联系QQ：939804642
|
|
