Trang Chính
- Code:
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js'/></script> <script type='text/javascript'> //<![CDATA[ $(function(){ $("a.acctitle").each(function(){ $(this).click(function(){ $(".accContent").each(function(){ $(this).hide("slow"); }); $("#"+$(this).attr("ref")).show("slow"); return; }); }); }); //]]> </script> <style type='text/css'> .accordion{ width:400px; } .accContent{ display:none; border:1px solid #cccccc; padding:3px; } .acctitle{ display:block; width:100%; padding:3px 0px 3px 3px; background-color:#cccccc; color:#000000; cursor:pointer } .defaultAccordion{ display:block; } </style> <div class="accordion"> <a ref="first_section" class="acctitle"><b>Tab 1</b></a> <div id="first_section" class="accContent defaultAccordion"> <center><a href="http://www.code1k.com" target="_blank"><img src="http://4.bp.blogspot.com/-FM_0ax4RlwY/UAUDQ1A5upI/AAAAAAAAI2M/MHokyW4FsM0/s600/code1k_circle_2.jpg" alt="" style="width:380px;"/></a></center> </div> <a ref="second_section" class="acctitle"><b>Tab 2</b></a> <div id="second_section" class="accContent"> <center><a href="http://www.code1k.com" target="_blank"><img src="http://1.bp.blogspot.com/-j1ujTUanCRo/UAUDX8vrDDI/AAAAAAAAI20/zqxXMjcVCsY/s600/code1k_circle_7.jpg" alt="" style="width:380px;"/></a></center> </div> <a ref="third_section" class="acctitle"><b>Tab 3</b></a> <div id="third_section" class="accContent"> <center><a href="http://www.code1k.com" target="_blank"><img src="http://1.bp.blogspot.com/-Sq5DlDe6gzc/UAUDPbvmDGI/AAAAAAAAI2E/x4K4sNjUDVA/s600/code1k_circle_1.jpg" alt="" style="width:380px;"/></a></center> </div> <a ref="four_section" class="acctitle"><b>Tab 4</b></a> <div id="four_section" class="accContent"> <center><a href="http://www.code1k.com" target="_blank"><img src="http://4.bp.blogspot.com/-25733i_FsYw/UAUDa-0sxhI/AAAAAAAAI3E/FWAdNJvRzsY/s600/code1k_circle_9.jpg" alt="" style="width:380px;"/></a></center> </div> <a ref="five_section" class="acctitle"><b>Tab more</b></a> <div id="five_section" class="accContent"> <center><img src="http://2.bp.blogspot.com/-FLGeI8OXgZA/UA-uu5JdIhI/AAAAAAAAJF0/9SQG7qk6dx8/s1600/gem-options-code1k.com.png" alt=""/> Hoặc bạn có thể thêm nhiều thẻ tiện ích khác...</center> </div> </div> <!-- Code1k.com -->
http://www.code1k.com/demo/2012/07/t...ung-truot.html
