首页 > 网络编程 > JavaScript > javascript类库 > jquery > jquery toggle jquery toggle faq 春江花月夜版 2010-05-13 18:51:43 作者： jquery toggle点击实现内容的显示效果，喜欢的朋友可以参考下。 <!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> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script><style> dt{cursor:pointer;font-weight:bold;line-height:26px;color:#53AEF8;} dd{line-height:23px;} p{line-height:23px;margin:0;padding:0;} </style> <script> $(function(){ $('#faq').find('dd').hide().end().find('dt').click(function(){ $(this).next().slideToggle(); }); }); </script></head> <body> <dl id="faq"> <dt>+ 春江花月夜</dt> <dd>春江花月夜，中国唐代诗人张若虚仅存的一首名诗，描绘春天夜晚江畔的景色，词句优美，被称为是“孤篇盖全唐”的杰作，闻一多称之为：“这是诗中的诗，顶峰上的顶峰。”。该诗曾被中国当代著名音乐家彭修文改编为民族管弦乐曲，并因此广为流传。</dd> <dt>+ 春江花月夜（其一）</dt> <dd> <p>春江潮水连海平，海上明月共潮生。滟滟随波千万里，何处春江无月明。</p> <p>江流宛转绕芳甸，月照花林皆似霰。空里流霜不觉飞，汀上白沙看不见。</p> <p>江天一色无纤尘，皎皎空中孤月轮。江畔何人初见月？江月何年初照人？</p> <p>人生代代无穷已，江月年年只相似。不知江月待何人，但见长江送流水。</p> <p>白云一片去悠悠，青枫浦上不胜愁。谁家今夜扁舟子？何处相思明月楼？</p> <p>可怜楼上月徘徊，应照离人妆镜台。玉户帘中卷不去，捣衣砧上拂还来。</p> <p>此时相望不相闻，愿逐月华流照君。鸿雁长飞光不度，鱼龙潜跃水成文。</p> <p>昨夜闲潭梦落花，可怜春半不还家。江水流春去欲尽，江潭落月复西斜。</p> <p>斜月沉沉藏海雾，碣石潇湘无限路。不知乘月几人归，落月摇情满江树。</p> </dd> <dt>+ 典故解释：</dt> <dd>【鸿雁长飞光不度／鱼龙潜跃水成文】 在中国古代，“鱼雁”和“书信”有着密切的渊源，古称信使为“鱼雁”，也叫“鸿鳞”。古诗文中留有许多记载，如“关山梦魂长，鱼雁音尘少”、“鱼书欲寄何由达？水远山长处处同”等，唐代著名诗人王昌龄诗中也有“手携双鲤鱼，目送千里雁”的句子。因为传说古代剖鲤鱼时，看见鱼肚里有书信——汉乐府《饮马长城窟行》中有“客从远方来，遗我双鲤鱼。呼儿烹鲤鱼，中有尺素书”——后来人们便把书信叫做“鱼书”了。而鸿雁是候鸟，往返有期，故人们想象鸿雁能传递音讯，因而书信又被称作“飞鸿”、“鸿书”等。《汉书·苏武传》载：“教使者谓单于，言天子射上林中，得雁，足有系帛书。”说的是汉武帝时，苏武奉命出使匈奴，被囚胡地19年，矢志不变。他后来得以归汉，主要是因为匈奴单于相信汉使所说鸿雁传书上林苑，被汉昭帝射获，确知苏武在北海牧羊。匈奴单于无奈，只得放回苏武，“鸿雁传书”一时传为美谈。由于这种渊源，“鱼雁”成为了中国早期邮政的象征，如同欧洲一些国家早期邮政以牛号角、牛角头为标志一般。 本诗中这两句其实就是借取“鱼雁”这两个典故而化用到春天江滨景物中的。“鸿雁长飞光不度”，是说传递书信的鸿雁已经早就远远地飞走了，而月光又不能渡过，因而也就不能替我传递音信。“鱼龙潜跃水成文”，指传递书信的鱼龙（这里偏指鱼）也跃入到幽暗的水底藏了起来，看不见了，只剩下水面的波纹而已，意思还是指找不到传递音信的办法。</dd> </dl> </body> </html> [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] 您可能感兴趣的文章:jQuery实现Meizu魅族官方网站的导航菜单效果jQuery实现鼠标悬停背景翻转的黑色导航菜单代码jquery实现最简单的滑动菜单效果代码jQuery+css实现的蓝色水平二级导航菜单效果代码jQuery实现MSN中文网滑动Tab菜单效果代码jQuery实现带动画效果的多级下拉菜单代码jquery实现标题字体变换的滑动门菜单效果jQuery实现默认是闭合的FAQ展开效果菜单
