I have the code working for the show and hide the div
. How would I add two different icons as a sprite image for when the show and hide are active?
For example: + icon for show me, then a - icon for hide me.
Here is the code, I have: http://jsfiddle.net/BLkpG/
$(document).ready(function(){
$(".slidingDiv").hide();
$(".show_hide").show();
$('.show_hide').click(function(){
$(".slidingDiv").slideToggle();
});
});
Need to change image to the above when toggled to a + or -.
Thanks
Try something like this
jQuery
$('#toggle_icon').toggle(function() {
$('#toggle_icon').text('-');
$('#toggle_text').slideToggle();
}, function() {
$('#toggle_icon').text('+');
$('#toggle_text').slideToggle();
});
HTML
<a href="#" id="toggle_icon">+</a>
<div id="toggle_text" style="display: none">
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s
</div>