رمز JavaScript كما يلي:
$ (document) .Ready (function () {$ ( الرسائل $ (". li: gt (4) "). slidedown () return false ؛}) ؛ // أظهر فقط أحدث الرسائل $ (". show_recent_only "). انقر فوق (function () {$ (this) .hide () $ (". show_all_message "). show () $ (.جزء من مدونة CSS كما يلي:
* {الهامش: 0 ؛ الحشو: 0 ؛ } body {margin: 10px auto ؛ العرض: 570 بكسل ؛ الخط: 75 ٪/120 ٪ Arial ، Helvetica ، Sans-Serif ؛ } p {padding: 0 0 1em ؛ } .message_list {list-style: none ؛ الهامش: 0 ؛ الحشو: 0 ؛ العرض: 383px ؛ } .message_list li {padding: 0 ؛ الهامش: 0 ؛ الخلفية: URL (الصور/الرسائل bar.gif) عدم التكرار ؛ } .message_head {padding: 5px 10px ؛ المؤشر: مؤشر. الموقف: قريب } .message_head .timestamp {color: #666666 ؛ حجم الخط: 95 ٪ ؛ الموقف: مطلق ؛ اليمين: 10px ؛ أعلى: 5 بكسل ؛ } .message_head cite {font-size: 100 ٪ ؛ خط الرصيف: جريئة ؛ على غرار الخط: طبيعي ؛ } .message_body {padding: 5px 10px 15px ؛ } .collapse_buttons {text-align: right ؛ أعلى الحدود: الصلبة 1px #e4e4e4 ؛ الحشو: 5px 0 ؛ العرض: 383px ؛ } .collapse_buttons a {margin-left: 15px ؛ تعويم: صحيح. . حشو اليمين: 12 بكسل ؛ } .show_recent_only {display: none ؛ الخلفية: url (الصور/arrow-arrow.gif) المركز الأيمن بدون تكرار ؛ حشو اليمين: 12 بكسل ؛ . حشو اليمين: 12 بكسل ؛ اللون: #666666 ؛}إضافة رمز إلى HTML على النحو التالي:
<ol> <li> <p> <site> Zhang San: </cite> <span> قبل 1 دقيقة </span> </p> <p> <p> hello <br/> </viv> </li> <li><p> <p> <cite> wang wu: </site> <span> منذ يوم واحد </pans> </p> <viv> <p> لأول مرة </p> </li> <li> <p> <p> <cite> li si: </cite> <p> <site> wang wu: </site> </site> </site> </li> <li> <p> <p> <cite> wang wu: </siete> </site> </site> </li> <p> <p> <cite> wang wu: </cite> </siet> منذ/span> </p> <viv> <p> دعم </p> </viv> </li> <li> <p> <site> li si: </cite> <span> 5 أيام </span> </p> <div> <p> مرحبًا بالجميع </p> <viv> <p> مرحبًا بالجميع </p> </viv> </li> <li> <p> <p> <cite> li si: </cite> <span> منذ 7 أيام </span> </p> <v> <p> هذا جيد </p> </p> </div> </li> مكان </p> </viv> </li> </ol> <p> <a href = "#"> إظهار جميع الرسائل (9) </a> <a href = "#"> إظهار خمس رسائل فقط </a> <a href = "#"> انهيار جميع الرسائل </a> </p> <b>
تنزيل القضية