关闭

[置顶] jquery插件实现手风琴效果!

2975人阅读 评论(0) 收藏 举报
<!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>

<!----引入jquery类库文件--->
<script language="javascript" type="text/jscript" src="./js/jquery-1.7.1.min.js"></script>

<script language="javascript" type="text/jscript" src="./js/jquery-ui-1.8.18.custom.min.js"></script>
<!----引入css类库文件--->
<link rel="stylesheet" href="./css/jquery-ui-1.8.18.custom.css" />


<script type="text/javascript">

$(document).ready(function (){
	
	// var option = { hrader: "h3",s}; [{},{},{}];	
	
	$("#accordion").accordion({
	
		header:"h3",  //头信息 必须是h3,页面中div中是什么这里必须是什么不能不写
		
		event:"mouseover",
		
		active:0,  //默认显示的面板
		
		autoHeight:true,
		
	
		//icons:{	   
			   		//header:"ui-icon-carat-2-e-w", //默认时的图标效果
			   		//headerSelected:"ui-icon-carat-2-n-s"  //面板激活状态时图标的效果
			   //}
		
		
	});

});
</script>


</head>

<body>

<div id="accordion" style="width:600px; height:300px;">

			<div>

				<h3><a href="#">新闻</a></h3>

				<div>       新华社、人民日报等中央媒体 持续关注"河南强征麦田"事件
近日,《南方日报》在线版连续报道了"河南上蔡县强制征地,铲平麦田"一事。此事引发了网络热议,CNTV、新华社及多家地方媒体跟进报道。昨日,《人民日报》亦对此事给予了关注。</div>

			</div>

			<div>

				<h3><a href="#">财经</a></h3>

				<div>       截至昨日,国内三大上市乳业巨头伊利、蒙牛、光明2011年年报均已公布。数据显示,这是继2008年三聚氰胺事件以来三大乳企公布业绩最好的一次。其中,伊利净利润同比增长133%,光明营收首次突破百亿,蒙牛全年收入373亿元。同时三家乳业巨头之中,伊利业绩增速最佳。

  值得注意的是,三大乳企广告投入均可谓大手笔,去年全年合计达到69.16亿元,日均约1900万元。</div>

			</div>


            
            <div>
				<h3><a href="#">房产</a></h3>
				<div>       
                今年一季度,房地产销售市场由前两个月的"极寒"状态,渐渐在3月出现暖意。这种回暖背后,是地方政策影响刚性需求的预期,以及龙头房企带头降价促销双重作用的结果。

  纵观一季度,房地产企业资金压力仍然很大,新一轮融资正如火如荼地展开。但根据《上海证券报》调查,市场对后市并不过于悲观:从政策面上看,尽管今年两会期间中央以"房价远未达到合理价位"来强调房地产调控的坚定性,但市场仍然对一些微调政策抱有期望。其间,只要企业不盲目乐观,贸然涨价,反而更积极地制定销售策略,今年仍有一些出货窗口出现。多数龙头房企完成与去年持平的销售目标仍是大概率事件。</div>

			</div>
            
            
            
            <div>
				<h3><a href="#">军事</a></h3>
				<div>       
                第二届核安全峰会召开在即,来自世界50多个国家和国际机构的领导人将齐聚韩国首尔,以加强核材料和核设施的安全为主题,重点讨论加强核安全的国家措施,共商国际合作的有效途径。

距离在华盛顿召开的首届核安全峰会已经过去两年,全球核安全形势喜忧参半。令人欣喜的是,国际社会更加重视核安全问题,各国积极采取措施落实上次峰会的主张和承诺,国际合作不断加强,全球核材料和核设施安全水平得到提高。</div>

			</div>
            
            
            
            <div>
				<h3><a href="#">互联网</a></h3>
				<div>       
                当Facebook跻身互联网巨头行列,社交网络的下一个创新方向便如同哥德巴赫猜想般,令人百般着迷。从最早的留言板、论坛、聊天室、ICQ、QQ,到后来的SNS、微博……互联网社交网络的演进就像一幅幅历史画面,不同时期由不同的社会化工具所主导。
艾瑞研究表明,在社交网络的发展过程中,个人越来越突出,过去信息是主题,而如今人更突出,信息定制个性化,更多以人为本,为人服务。
《互联网周刊》主编姜奇平评论指出,人们往往有一个错觉,就是以为发现互联网,是为了进步,可以有效加强这种联系。
腾讯刚刚上线内测的QQ圈子被业界观察人士认为在"以人为本"方向具备很大。</div>

			</div>
            
   
		</div>
        
</body>
</html>


效果如下:




0
0

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