Trying to change img src if another element is visible with jQuery
- by R.J.
I have a div ("panel" class) on my page that toggles open/closed on the click of a paragraph element ("flip" class), which has an image inside of it.
Here's the HTML:
<div class="panel">Contact info</div>
<p class="flip"><img src="images/contactExpand.png" />Expand</p>
And the jQuery:
$(".flip").click(function(){
$(".panel").slideToggle("slow");
});
Everything works fine so far, but I want the image src to change to "contactCollapse.png" when the panel div is visible. This doesn't seem to do anything (image just stays the same):
if ($(".panel").is(":visible") == true) {
$(".flip img").attr("src","../images/contactCollapse.png")
}
else {
$(".flip img").attr("src","../images/contactExpand.png")
}
Am I missing something? Thanks for any help!
