Implemented code on my site, this is a retractable chatbox. It has two images, one of which is to open the chatbox and another to close. However, when you open the chatbox, it will have two "Closed" images as you can see below:
I'dliketoseeonlytheimagenexttoit.
Code:
jQuery(document).ready(function(){s="jQuery('#chatboxpop').animate({width:'toggle'},350); jQuery('#chatboxopen,#chatboxclose').toggle();";
jQuery('body').prepend('<div style="overflow: visible; position: fixed; bottom: 30px; height: 400px; right: 0px; z-index:1000;"><iframe src="http://bloodypalacerpg.chatango.com/"id="chatboxpop" scrolling="yes" style="height: 300px; border: 2px solid #000000; -webkit-border-radius: 3px; float: right; overflow-x: visible; overflow-y: visible; display: none; width:600px" marginwidth="0" marginheight="0" frameborder="0"></iframe><div onclick="'+s+'" style="margin-top: 10px; cursor :pointer; float:left"><img src="http://i34.servimg.com/u/f34/16/04/51/75/open10.png"id="chatboxopen" style="display: inline; "><img src="http://i34.servimg.com/u/f34/16/04/51/75/close10.png"id="chatboxclose" style="cursor: pointer; display: none; "></div></div>')
});