关闭

jQuery-ui中的手风琴效果

412人阅读 评论(0) 收藏 举报

手风琴效果实现思路

在body中书写下面的div,content的内容可以根据需要复制任意个

<div id="accordion">

            <div id=content>
                <h3><a href="#">First</a></h3>
                <div>Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet.</div>

            </div>

...........

</div>

引用js和css

<script language="javascript" type="text/javascript" src="js/jquery-1.7.1.min.js">
</script>
<script language="javascript" type="text/javascript" src="js/jquery-ui-1.8.18.custom.min.js">
</script>
<link rel="stylesheet" href="css/ui-lightness/jquery-ui-1.8.18.custom.css" />

核心script语句

$(function (){
    
    $("#accordion").accordion({
    
        header: "h3",//这里的字号可以任意改变,根据div中的改变
        animated: "bounceslide" ,//动画
        event: "mouseover",//鼠标放上去,选中,默认值是clike
        change: function(event, ui){
            
            }
        });
0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:43629次
    • 积分:813
    • 等级:
    • 排名:千里之外
    • 原创:38篇
    • 转载:18篇
    • 译文:0篇
    • 评论:8条
    文章分类
    最新评论