نماد سایت طراحان وب تبریز – طراحی سایت در تبریز – آژانس خلاقیت وب سایت تبریز

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

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

خروج از نسخه موبایل