1、myFocus库(v1.1.0 | 2010.12.15)下载 & CDN Hosted
min版:http://myfocus-js.googlecode.com/svn/trunk/myfocus-1.1.0.min.js(6.72KB,推荐)
full版:http://myfocus-js.googlecode.com/svn/trunk/myfocus-1.1.0.full.js(8.81KB)
2、风格应用下载 & CDN Hosted
请点击进入相应目录页面
标准风格应用文件目录:http://myfocus-js.googlecode.com/svn/trunk/pattern/
自定义风格应用文件目录:http://myfocus-js.googlecode.com/svn/trunk/pattern-sd/
3、插件下载(myFocus Easing - 为你的焦点图增加更多的动画效果选择)
myFocus.easing.1.0
4、myFocus库+风格应用+Demo完整打包下载
myFocus all v1.1.0(12.15更新)
只需简单3步:
Step 1、在html的标签内引入myFocus库和风格应用文件
(为了使用方便,myFocus库文件和风格应用文件都已托管在谷歌code,大家可以直接引入使用)
Step 2、创建标准的(myFocus)html结构,并填充你的内容(tip1:例子li数为5,实际可随意增减,但至少为2)
Step 3、在step1代码之后的任意一个位置调用(建议在标签结束前调用)
//你可以简单参数调用:
myFocus.set({
id:'boxID',//焦点图盒子ID
pattern:'mF_name',//风格应用的名称
time:3,//切换时间间隔(秒),省略设置即不自动切换
width:450,//设置宽度(主图区)
height:296//设置高度(主图区)
});
//或详细一点的参数调用(推荐):
myFocus.set({
id:'boxID',//焦点图盒子ID
pattern:'mF_name',//风格应用的名称
time:3,//切换时间间隔(秒),省略设置即不自动切换
trigger:'click',//触发切换模式:'click'(点击)/'mouseover'(悬停),默认'click'
width:450,//设置宽度(主图区)
height:296,//设置高度(主图区)
txtHeight:'default'//文字层高度设置,'default'为默认高度,0为隐藏,默认'default'
});
»有关myFocus焦点图的名称解释
1、关于风格应用:
所有的风格应用包含两个文件,一个为js,一个为css,你可以下载更多的风格应用,再引入到你的html文件中使用即可;
风格应用文件的名称一般为mF_name;mF表示myFocus,name当然是这风格应用的名字;
带略缩图的为:mF_name_tb;后面的tb表示略缩图;
自定义结构的为:mF_sd_name;其中sd表示自定义结构;
2、关于标准html结构中img标签的属性定义
src是大图地址;(这还用说吗- -||..)
thumb是小图(即略缩图地址,留空即把大图当作小图地址);
alt是显示的标题文字
text是的更详细的描述文字
内容列表中li的数目(即焦点图的图片数)可随意增删。
»使用中可能会遇到的问题
1.myFocus兼容性如何?可以免费使用吗?
myFocus兼容目前所有的主流浏览器,包括IE6+,FF3.5+,Chrome5.0+等,而且在各个浏览器中的表现效果保持一致。
myFocus在保留基本著作信息的前提下可以免费任意使用。
2.打开焦点图瞬间它撑大了页面造成体验不好,原因?怎么修正?
撑大页面的原因主要是网络上存在延迟 & IE的代码执行延迟,导致它没有及时的应用上正确的样式。解决方法有3个:
一是在焦点图的div手动加上对应风格的class,例如应用的风格是mF_taobao2010,那么对应加:
另外一个是在它的div直接加style样式,例如:
最后一个是从根本上解决代码的执行延迟,因为myFocus常规情况下是等页面onload/加载完所有图片才执行风格代码,但页面元素过多内容庞大时,这种等待有点浪费,可以选择让它立即执行,只需在调用参数后面多加一个true参数即可:myFocus.set({你的参数设置},true);但需要注意的是这样的调用只能放在myFocus的div结构之后,在复杂的页面上应用myFocus时推荐这样的做法。
3.myFocus使用GB2312编码不行?一定要用utf-8吗?
myFocus文件默认是utf-8格式,在GB2312编码的网页上使用按情况需要加charset="utf-8"
例如:
另一种解决方法是把js文件保存为gb2312编码(windows记事本默认的保存格式)。
还有任何疑问可以到论坛留言或发送到我的E-Mali:koen_lee#qq.com(#改为@)