0

次のトグルを組み合わせて、最初の段落内のスパンとして more ボタンを使用して最初の段落を表示します。more をクリックすると他の段落が表示されて more ボタンが非表示になりますが、less ボタンをクリックすると more ボタンに戻る必要があります。

   <script>
    $('div#introduction').each(function(){
     var NODES = $(this).find('p').length;
     if(NODES>0){
      $(this).find('p:first').addClass('first');
      $(this).find('p:last').addClass('last');
      $('#introduction p.first').append('&nbsp;<span class="more"><a class="toggle">More</a></span>');
      $('#introduction p.last').append('&nbsp;<span class="less"><a class="toggle">less</a></span>');
      $('#introduction p').hide().slice(0,1).addClass('fixed').show();
      $('.toggle').click(function(){
       $( ".more" ).hide();
       $('p:not(.toggle,.fixed)').toggle();
       $(this).text(function(_, ML){
        return ML === 'Less' ? 'More' : 'Less';
       });
      });
     }
    });
   </script>

よろしくお願いします

ストゥ

4

2 に答える 2