您的位置:首页 > 产品设计 > UI/UE

jq.contentShown 的 API, Callback参数,data格式和build格式说明。

2012-05-09 15:01 417 查看
callback回传参数说明:

id //当前Dom的ID,在你页面未设置ID的情况下这个ID会是插件自动生成的唯一值。

total //轮显内容的数量

/*
当前选择的第一个内容区域,当你loop设置为false时此内容就是页面Dom中的index值,当loop为true时导航区域需要根据 attr('data-index')来获取当前的index。player区域不受loop限制,永远为当前内容的index值
*/
selected
curNav//当前导航,可以通过 attr('data-missing')来确认内容是否正常加载。

curPlay//当前显示的主要内容,可以通过 attr('data-missing')来确认内容是否正常加载。


主要api 使用方式 $.contentShown.function(id);

stop(id) //停止当前DOM的自动播放。
start(id) //开始自动播放
playPause(id)//暂停播放区域的动画执行,一般使用在回调函数中
playStart(id)//开始刚才暂停的播放动画,回调函数执行完毕后,可以继续播放动画。
setCallback(id)//允许设置返回参数,你可以按照自己的需要设置插件返回那些参数。
setDefaults(settings)//设置 参数


Data数据格式说明:

"data"        : [ //最完整的data格式介绍以及说明 其中所有设置中 g 代表 target 除提示信息中的按钮 "b_" 中 t 代表title外,其它设置中 t 一律代表内容。
{
"b": "", //"b":{"t":"","l":"","g":"","a":""} 用这种方式刻度设置链接,独立设置打开方式,设置图片alt。
"s": "",
/*
* 导航区域内容
* 对象形式 "s":{"t":"","l":"","g":"","a":"","w":"","h":""} ,
* 在使用不规则导航图的情况系需要设置 w(width) 和 h(height)
**/

"l": "", //global link 当前数据中所有使用链接的地方,如果未单独设置则使用global link。
"t": "", //"t":{"t":"","l":"","g":"","a":""} 主标题h2
"t1": "", //"t1":{"t":"","l":"","g":"","a":""} 副标题h3
"m": "", //介绍,可以是任何形式的html内容。
"b_": ""
/*
* 对象的形式:b_':{'c':'','l':'','g':'','t':'','t_':''}
* class(后缀,btn-class,btn在样式表中已经存在),
* link, target, title, text,
* 如果有多个按钮请使用数组。[{按钮1},{按钮2}],
* 从第二个开始 自动增加样式 btn1,btn2...btn(n)(btn为样式表中全局btn样式)
* 你可以在样式表中独立重置每个按钮的位置,大小等等。
**/

"tp":"" //type 即演示中右上角显示的内容。

"ot":[//other title 多个对象的情况请使用数组,单个对象数组形式为可选。
{
'n':'标题',
'list':[
{"t":"content","l":"link"},
{"t":"content","l":"link"},
{"t":"content","l":"link"}
]
},
{
'n':'标题1',
'list':{"t":"content","l":"link"}
},
{
'n':'标题2',
'list':{"t":"content","l":"link"}
}
]
},
......

]


Build 格式说明:

导航格式:
<ul>
<li class="cs-nav-item">
<div class="this-content">content</div>
<p class="global-link">link.href</p>
</li>
<li class="cs-nav-item">...</li>
......
</ul>

player:

<li class="cs-player-item">
<p class="this-content"><a href="http://www.gomesoft.com/avi/convert-avi-to-quicktime-mov-mac.html" target="_blank"><img src="../content/images/avi-to-mov-mac.jpg"></a></p>
<p class="global-link">http://www.gomesoft.com/avi/</p>
<label>
<h2><a href="http://www.gomesoft.com/avi/convert-avi-to-quicktime-mov-mac.html" target="_blank">Convert AVI to MOV Mac</a></h2>
<p class="tip-message">Cheap Video Converter</p>
<p class="tip-btns">
<a class="zy" href="http://www.google.com" title="按钮1"></a>
<a class="zy" href="http://www.google.com" title="按钮2">点击这里</a>
</p>
<p class="play-type">zy</p>
<p class="other-titles">
<span>分类</span>
<a href="http://www.google.com">家庭剧</a>
<a href="http://www.google.com">言情剧</a>
</p>
<p class="other-titles">
<span>导演</span>
<a href="http://www.google.com">Ethan</a></p>
<p class="other-titles">
<span>主演</span>
<a href="http://www.google.com">演员1</a>
<a href="http://www.google.com">演员2</a>
</p>
</label>
</li>


需要注意的是 player区域的global link只有在导航区域未设置的状态西起作用。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: