javascript - How can I toggle texts and icons using jQuery? -
i have accordion.

when click on show details :
- the accordion content expand,
- the text change
show detailshide details - the icon change
+x - click on again should toggle original state.

i couldn't work. when click on it, stuck on hide details state forever.
js
$(".show-details-sk-p").click(function () { $(".show-details-txt-sk-p-r").text("hide details"); $(".icon-sk-p-r-toggle").attr("src", "http://s6.postimg.org/e9eydpbct/remove.png"); }); can please give me little push here ?
i've put fiddle - in case needed.
inspected aciton , element behavior, find #sk-p-r have class in decide whether collapsed or not.
$(".show-details-sk-p").click(function () { var iscollapse = $('#sk-p-r').hasclass('in'); var text = iscollapse ? 'show details' : 'hide details'; var img = iscollapse ? 'http://s6.postimg.org/e9eydpbct/plus.png' : 'http://s6.postimg.org/bglqtob0d/remove.png' $(".show-details-txt-sk-p-r").text(text); $(".icon-sk-p-r-toggle").attr("src", img); });
Comments
Post a Comment