1：使用者API

常规调用：myFocus.set(param,[DOMReady],[callback]);

jQuery调用：$(expr).myFocus(param,[callback]);

参数param为JSON格式数据，包含以下基本属性设置：

• id

  焦点图盒子ID[string(字符串)]，无默认值，必填项

• pattern

  风格应用名称[string(字符串)]，默认值：'mF_fscreen_tb'

• time

  切换时间间隔[num(数字，单位秒)]，默认值：4

• width

  图片区域宽度[num(数字，单位像素)]，无默认值，留空则从CSS样式获取大小

• height

  图片区域高度[num(数字，单位像素)]，无默认值，留空则从CSS样式获取大小

• txtHeight

  文字层高度['default'(默认高度)|0(隐藏)|num(数字，单位像素)]，默认值：'default'

• trigger

  触发切换模式['click'(鼠标点击)|'mouseover'(鼠标悬停)]，默认值：'click'

• wrap

  是否保留边框(有的话)[true|false]，默认值：true

• auto

  是否自动播放[true|false]，默认值：true

• index

  开始显示的图片序号(从0算起)[num(数字)]，默认值：0

• delay

  触发切换模式中'mouseover'模式下的切换延迟[num(数字,单位毫秒)]，默认值：100

• css

  是否需要程序定义CSS[true|false]，默认值：true

• waiting(1.2.0新增)

  Loading画面的最长等待时间(即从开始载入--图片加载完--开始播放之间的等待时限，如果超过这个时限，即使图片没加载完都一律播放)[true(一直等待，直到所有焦点图片全部加载完)|false(完全不等待，直接播放)|num(时限,单位秒)]，默认值：20

• path(1.2.0新增)

  风格应用文件的目录路径[string(字符串)]，默认值：'http://www.chhua.com/myfocus/js/pattern/'。注意此路径是指向风格文件父目录而不是某个风格文件，例如mF_slide3D这款风格文件在pattern文件夹目录下，那么path应该为'pattern/'。

• autoZoom(1.2.1新增)

  是否允许图片按比例缩小并居中以适应图片区域大小(注意：某些风格可能不支持)[true|false]，默认值：false。

param参数中除了id项是必填外，其它都为可忽略设置，其中绿色是常用设置，在使用中建议保留。这些设置对所有风格应用都有效。

DOMReady是可选参数，表示焦点图DOM结构是否已建立。设置true即告诉程序已建立DOM，myFocus可以立即运行；省略设置或设置false即让程序自动判断(相当于放到JQ的ready函数中运行)。当在焦点图DIV标签后面调用myFocus.set的时候可以设置其为true以加快响应效率。

callback是可选回调函数，当焦点图全部准备就绪后(开始播放前)调用，在这里可设置自定义事件。

myFocus的参数类型

在myFocus中，有3种类型的参数设置：

1、全局参数设置（myFocus库）；

2、风格参数设置（某款风格）；

3、调用参数设置（myFocus.set函数）。

上面的param参数设置显然属于3、调用参数设置。

它们的优先级为：3>2>1，即如果3和1有一个参数属性设置重复，那么3(调用参数设置)会覆盖1(全局参数设置)。

从这样看，上面param参数的所有属性都是可以省略设置的，包括id，但前提是必须在其他两个类型的设置中已经有预设值，例如在风格参数设置中留有id预设值，那么在调用的时候可以省略包括id属性在内的所有参数设置 (查看demo)，为了方便维护，一般不建议这样做。

全局参数是在myFocus源代码中预先设置的，和调用参数一样，它们对所有的风格应用都有效。例如在它们任何一个中设置time:3，那么无论是应用哪款风格，它们的切换时间间隔都是3秒。

风格参数设置则不同，它们的设置只对这款风格有效，而且它们往往是一些自定义参数属性。

例如chip(切片数量)，它在mF_liuzg风格的js文件中定义，并且这个参数属性只对这款风格有效。

风格参数设置是通过myFocus.set.params函数实现，并在对应风格的JS文件中定义。通过它，我们就可以知道这款风格是否有自定义参数或个性化默认值，当然也可以在外面调用这些属性以覆盖其默认值。

2：开发者API

myFocus崇尚“简单即是美”，没有最好，只有最合适。

在myFocus世界里，一切html元素结构都是由列(<li>)构成。(附：myFocus焦点图制作教程)

注：下面方法（除了子类）全部属于myFocus类/空间。

Base

.defConfig

myFocus的全局默认参数设置

.set.params(patternName,params)

myFocus风格应用的个性默认参数设置，patternName为风格名称，params为参数集，优先级为：页面调用参数设置>个性默认参数设置>全局默认参数设置

.extend(parent,[obj1,obj2...])

把obj1,obj2...属性扩展到parent对象上，如果只有一个参数，那么默认扩展myFocus的子类pattern

DOM

.$(id)

以id方式查找DOM元素

.$$(tag,parrent)

在parrent范围内以tag标签名称方式查找DOM元素，parrent可以是DOM对象或DOM的id名称

.$$_(tag,parrent)

在parrent(DOM)范围内以tag标签名称方式查找DOM元素，并且它们是直接的父子关系

.$c(className,parrent)

在parrent(DOM)范围内以class名称方式查找DOM元素，只返回找到的第一个元素

.$li(className,parrent)

在parrent(DOM)范围内查找ul的class名称为className中的li元素集，并且它们是直接的父子关系

.wrap(arr,className)

在arr(DOM数组)外面添加一个div元素的外包wrap,className为此div的class名称

.wrapIn(parrent,className)

在parrent(DOM)里面添加一个ul元素的内包wrap,className为此ul的class名称

.addList(parrent,[className1,className2,className3,...])

在parrent(DOM)里面分别添加class名称为className1、className2、className3...的ul列表，li数同焦点图的图片数相等。其中封装有'txt','num','thumb'以生成文字、数字以及略缩图

CSS

.style(DOM,attr)

获得DOM元素CSS样式attr的值，如果是带数字值则只返回数字(opacity返回0~1)

.setOpa(DOM,value)

设置DOM元素的透明度，范围：0~100

.removeClass(DOM,className)

去除DOM元素的某个class，如果不存在不作处理

Anim

.animate(obj,attr,value,duration,easing,callback)

最底层的运动函数(只支持带数值的变化)，obj：运动对象，attr：属性，value：值(支持+-操作)，duration：持续时间(默认800毫秒)，easing：缓动方式(默认easeOut)，callback：回调函数

.fadeIn(obj,duration,callback)

淡出函数，duration默认400毫秒

.fadeOut(obj,duration,callback)

淡入函数，duration默认400毫秒

.slide(obj,params,duration,easing,callback)

滑动函数(只支持带数值的变化)，obj：运动对象，params：参数集(attr:value形式，支持+-操作)，duration：持续时间(默认800毫秒)，easing：缓动方式(默认easeOut)，callback：回调函数

.stop(obj)

停止obj的所有运动效果

Init

.set(param,[DOMReady],[callback])

页面调用myFocus函数，param为JSON格式参数集，DOMReady和callback为可选，分别表示焦点图DOM结构是否已建立(true|false)、焦点图全部准备就绪后(开始播放前)的回调函数

.initCSS(params)

初始化myFocus的CSS样式

Method

.switchMF(fn1,fn2,isless,direction,container)

焦点图轮换函数,fn1:前一帧的变化函数,fn2:后一帧的变化函数,islees:是否无缝(默认undefined),direction:无缝时的方向(默认为'left'),container:无缝的容器(默认为pics)

.bind(btnArray,type,delay)

为一组按钮绑定与焦点图的交互事件，btnArray:按钮组,type:事件类型('click'或'mouseover'),delay:'mouseover'事件中的延迟(毫秒)

.toggle(obj,class1,class2)

为obj绑定点击切换不同的状态(停止或开始)和切换不同的class(class1或class2)的事件

.scroll(obj,direction,distance,number,duration)

略缩图的滚动函数，obj:滚动对象,direction:滚动方向,distance:每次滚动的距离,number:显示略缩图的数目,duration:每次滚动持续时间

.turn(prevBtn,nextBtn)

为两个按钮分别绑定前一帧和后一帧事件

.alterSRC(obj,alterStr,isdel)

改变obj内的img的src地址，alterStr:增加的字符串，isdel:是否删除增加的字符串

.addEvent(obj,type,fn)

为obj绑定事件，type:事件类型,fn:响应函数

子类：Easing 缓动

.linear()

匀速运动

.swing()

摆钟缓动

.easeIn()

加速缓动(4次方)

.easeOut()

减速缓动(4次方)

.easeInOut()

加速再到减速的缓动(4次方)

子类：Pattern 风格应用

无任何风格应用集成（全部为按需加载）