طراحی آیتم های بیشتر برای لیست های بلند توسط jqueryReviewed by Datacss.ir on Feb 2Rating:

برای ایجاد لینک آیتم های بیشتر برای لیست های بلند می توانید از کد 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>

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

این فیلد را پر کنید
این فیلد را پر کنید
لطفاً یک نشانی ایمیل معتبر بنویسید.

فهرست