<div class="post-content">
        <p>Random text >Random text >Random text Random text >Random text >Random text Random text >Random text >Random text Random text >Random text >Random text Random text >Random text >Random text Random text >Random text >Random text Random text >Random text >Random text Random text >Random text >Random text Random text >Random text >Random text Random text >Random text >Random text Random text >Random text >Random text Random text >Random text >Random text </p>
        <p>More text More text More text More text More text More text More text More text More text More text More text More text More text More text More text More text More text More text More text More text More text More text More text More text </p> 
        <span class="more">more/less</span>
</div>

$('.post-content p:not(:first-child)').css('display', 'none');

$(".more").click(function () {
    $('.post-content p:not(:first-child)').css('display', 'block');
});

próbny

Problem jest oczywisty. Muszę dokonać efektu przełączania, aby pokazać ukryć wszystkie p po pierwszym akapicie.

0
anvd 5 grudzień 2013, 05:10

2 odpowiedzi

Najlepsza odpowiedź

Zamiast tego użyj hide i toggle:

// cache elements so you don't repeatedly query the DOM
toggleParas = $('.post-content p:not(:first-child)');

toggleParas.hide();

$(".more").click(function () {
    toggleParas.toggle();
});
2
tckmn 5 grudzień 2013, 01:12

Demo

$('.post-content p:eq(1)').hide();

$(".more").click(function () {
   $(this).prev('p').slideToggle();
});
1
Roko C. Buljan 5 grudzień 2013, 01:17