طراحی آیتم های بیشتر برای لیست های بلند توسط jquery طراحی آیتم های بیشتر برای لیست های بلند توسط jquery

رتبه این آیتم
طراحی آیتم های بیشتر برای لیست های بلند توسط jquery
رتبه 5 در 1 رای از 1 تا 5

برای ایجاد لینک آیتم های بیشتر برای لیست های بلند می توانید از کد jquery زیر استفاده نمایید.

 <html>

<head><title>Test</title></head>

<body>

<ul class="more">

  <li>one</li>

  <li>two</li>

  <li>three</li>

  <li>four</li>

  <li>five</li>

  <li>six</li>

  <li>seven</li>

  <li>eight</li>

  <li>nine</li>

  <li>ten</li>

</ul>

<script type="text/javascript" src="/jquery-1.3.1.js"></script>

<script type="text/javascript">

$(function() {

  $("ul.more").each(function() {

    $("li:gt(4)", this).hide(); /* :gt() is zero-indexed */

    $("li:nth-child(5)", this).after("<li class='more'><a href='#'>More...</a></li>"); /* :nth-child() is one-indexed */

  });

  $("li.more a").live("click", function() {

    var li = $(this).parents("li:first");

    li.parent().children().show();

    li.remove();

    return false;

  });

});

</script>

</script

</body>

</html>

14-مرداد-1392

نویسنده این مقاله می باشد که از سال 1381 تا کنون در زمینه طراحی و بهینه سازی وب سایت فعالیت دارد.

شبکه اجتماعی های نویسنده اینستاگرام و لینکدین.

به اشتراک گذاری مطلب در

به اشتراک گذاری در فیس بوک به اشتراک گذاری در توئیتر به اشتراک گذاری در لینکدین

يک نظر بدهيد

موارد ستاره دار الزامی هستند

طراحی سایت دارکوب | هاست دارکوب | دارکوب نام و علامت تجاری ثبت شده این مجموعه می باشد.
دارای مجوز از (سازمان نظام صنفی رایانه ای استان تهران) ، (رتبه 4 شورای عالی انفورماتیک کشور) ، (وزارت فرهنگ و ارشاد اسلامی)
آموزشگاه طراحی سایت و سئو با مجوز رسمی از سازمان فنی و حرفه ای کشور افتتاح شد
دارکوب به عنوان شرکت خلاق توسط معاونت علمی و فناوری ریاست جمهوری برگزیده شد