关闭

js jquery 图文并茂讲解手风琴,

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

鼠标移到third上显示


鼠标移到second上显示



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<script language="javascript" src="../jquery插件/jquery-ui-1.8.18.custom/js/jquery-1.7.1.min.js"></script>
<script language="javascript" src="../jquery插件/jquery-ui-1.8.18.custom/js/jquery-ui-1.8.18.custom.min.js"></script>
<link rel="stylesheet" type="text/css" href="../jquery插件/jquery-ui-1.8.18.custom/css/ui-lightness/jquery-ui-1.8.18.custom.css" />
<script language="javascript">
 $(function (){
//运用jquery生成手风琴
$("#accordion").accordion({ 
header: "h3",
disabled:false,
active:2,
animated:'bounceslide',
event:'mouseover',
navigation:true,
});
})
</script>
<body>
<div id="accordion">
<div>
<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>


<h3><a href="#">Second</a></h3>


<div>Phasellus mattis tincidunt nibh.</div>


</div>


<div>


<h3><a href="#">Third</a></h3>


<div>Nam dui erat, auctor a, dignissim quis.</div>


</div>


</div>


</body>
</html>

0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:88273次
    • 积分:1146
    • 等级:
    • 排名:千里之外
    • 原创:36篇
    • 转载:11篇
    • 译文:1篇
    • 评论:5条
    最新评论