myFocus可扩展图片数量的js图片轮播
- 作者：网页模板
- 大小：0.192MB
- 点击次数：
- 发布时间：2014-05-16 10:41
特效介绍
myFocus可扩展图片数量的js图片轮播，过渡效果非常有特色。myFocus是自带27种幻灯效果，3种自定义幻灯效果的专业js图片轮播库。更多关于myFocus可以访问：myFocus图片轮播
使用方法
1、引入下面的css和js文件：<script src="js/myFocus.js" type="text/javascript"></script> <link href="images/css.css" rel="stylesheet" type="text/css" />2、在body添加下面的代码：
<div class="myFocus-box">
<div id="myFocus">
<div class="loading"><span>请稍候...</span></div><!--载入画面-->
<ul class="pic"><!--内容列表-->
<li><a href="http://www.5imoban.net"><img src="images/1.jpg" thumb="" alt="遗落的海星" text="" /></a></li>
<li><a href="http://www.5imoban.net"><img src="images/2.jpg" thumb="" alt="碧绿的麦芒" text="" /></a></li>
<li><a href="http://www.5imoban.net"><img src="images/3.jpg" thumb="" alt="幽深的森林" text="" /></a></li>
<li><a href="http://www.5imoban.net"><img src="images/4.jpg" thumb="" alt="花海" text="" /></a></li>
<li><a href="http://www.5imoban.net"><img src="images/5.jpg" thumb="" alt="漂亮的美食网站模板" text="" /></a></li>
</ul>
</div>
</div>
3、调用代码在myFocus.js文件里面，参数详解见下面：myFocus.setting({
style:'mF_liuzg',//风格样式
id:'myFocus',//焦点图ID
trigger:'mouseover',//按钮切换模式：'click'(点击触发)/'mouseover'(悬停触发,默认有0.1秒延迟，可以自行添加参数'delay:毫秒'设置)
time:4,//切换图片的时间间隔，单位秒
chip:8,//图片切片数量，能被焦点图的高整除才有效，默认为8片
type:4,//切片效果，1为甩头，2为甩尾，3为凌乱，4为随机效果
txtHeight:36,//文字层高，36为推荐，0为隐藏
width:450,//宽(大图)，注意:整个焦点图的宽等于或大于图片宽
height:296//高(大图)，注意同上
});
- 本文标签：
- myFocus,js图片轮播
