插件描述:这是一款jQuery显示隐藏更多文字内容插件。该插件可以将很长的一段文字按要求进行部分隐藏和全部展示,并且可以定制隐藏和展开内容时的动画效果。
jquery.morecontent.js
这是一款jQuery显示/隐藏更多文字内容插件。该插件可以将很长的一段文字按要求进行部分隐藏和全部展示,并且可以定制隐藏和展开内容时的动画效果。
使用方法
在页面中引入jquery和jquery.morecontent.js文件。
HTML结构
页面的HTML结构如下。
这里是一段很长很长的文本......
JavaScript
在页面DOM元素加载完毕之后,通过moreContent()方法来初始化该插件。$('.example').moreContent();
配置参数
设置隐藏时显示文本的最大高度。默认为175。$('.example').moreContent({
height:200
});
设置触发内容隐藏/显示的事件,默认为click。$('.example').moreContent({
event:'mouseover'
});
设置是否使用阴影效果。$('.example').moreContent({
shadow:true
});
设置动画的缓动效果。$('.example').moreContent({
easing:'easeOutBounce'
});
设置展开和收起时按钮上的文字。$('.example').moreContent({
textClose:'ShowMore',
textOpen:'Close'
});
其它可用的配置参数有:$('.example').moreContent({
useCss:true,
speed:250,
tpl:{
content:'
contentWrap:'
btn:'',
btnWrap:'
controls:'
shadow:'
}
});