html查看更多隐藏内容,jQuery点击显示隐藏更多文字内容插件jquery.morecontent.js

插件描述：这是一款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: 'Show More',

textOpen: 'Close'

});

其它可用的配置参数有：$('.example').moreContent({

useCss: true,

speed: 250,

tpl: {

content: '

contentWrap: '

btn: '',

btnWrap: '

controls: '

shadow: '

}

});