There is an info block. When you click on the "Read more" button (with the pointer down), the detailed text of the info block leaves, the button should change to "Minimize" and an up arrow appears. How to implement a smooth replacement of the text of the "Read more" button on the "Minimize" and the replacement of the down arrow on the up using jquery / css? Thank!

    1 answer 1

    var s = 'Свернуть' $('.text').click(function() { $(this).animate({ opacity: 0 }, 500, function() { $(this).attr('value', s).animate({ opacity: 1 }, 500,function(){if(s=='Свернуть')s='Читать далее';else s='Свернуть';}) }) }) 
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input type="submit" name="text" class="text" value="Читать далее">

    The essence is simple in animate you shove css attributes you need