jquery - Hide the excerpt and re show it when re toggled -
i have done best this,.. took me hours still cant work. when readmore clicked hides excerpt , shows full content, re names buttons hide, when hide clicked again, has show excerpt again , hide full content.
here's fiddle
jquery code
jquery(document).ready(function () { jquery('.testi-more').click(function (e) { e.preventdefault(); var same = jquery(this).closest('.testi-wrapper'); jquery(this).closest('.testi-wrapper').children('.testi-full').slidetoggle('slow'); }); if (jquery('.testi-full').is(": hidden")) { jquery(this).closest('.testi-wrapper').children('.testi-excerpt').show(); jquery(this).closest('.testi-wrapper').children('.testi-more').html('read moar'); } else { jquery(this).closest('.testi-wrapper').children('.testi-excerpt').hide(); jquery(this).closest('.testi-wrapper').children('.testi-more').html('hide'); } });
kindly optimize code explain why, can study it. thanks!
is you're looking
jquery(function($) { $('.testi-more').on('click', function(e) { e.preventdefault(); $(this).text(function(_,txt) { return txt == 'read more' ? 'hide' : 'read more'; }).closest('.testi-wrapper').children('.testi-full') .slidetoggle('slow').end().children('.testi-excerpt').slidetoggle(); }); });
it toggles sliding , toggles text callback current text checked, , text returned depending on current text etc.
Comments
Post a Comment