jnf555 Posted October 10, 2010 Share Posted October 10, 2010 hi i have a thumbnail that i can mouseover to be seen in a diferent position, what i would like to do is move away from the thumbnail and the diferent positioned img not be seen, i think it will involve using mouseout but i am not having much look, anyone help please.<html><head><script type="text/javascript">function showme(href){document.getElementById("specimen").src=href;return false;}</script><style></style></head><div><img src="" alt="" width="400" height="300"id="specimen"></div><div><a href="mablebeach.jpg" onmouseover="return showme(this.href)"><img src="mablebeach.jpg" alt="picture1" width="85" height="80" style="opacity:0.6;filter:alpha(opacity=40)"onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100"onmouseout="this.style.opacity=0.6;this.filters.alpha.opacity=40" </a></div></html>thanksjnf555 Link to comment Share on other sites More sharing options...
MrFish Posted October 11, 2010 Share Posted October 11, 2010 Yes, use onmouseout like you are using onmouseover. Link to comment Share on other sites More sharing options...
jnf555 Posted October 12, 2010 Author Share Posted October 12, 2010 thanks for reply, jnf555<html><head><script type="text/javascript">function showme(href){document.getElementById("specimen").src=href;return false;}function hide(href){document.getElementById("specimen").src="";return false;}</script><style></style></head><div><img src="" alt="" width="400" height="300"id="specimen"></div><div><a href="mablebeach.jpg" onmouseover="return showme(this.href)"onmouseout="return hide(this.href)"><img src="mablebeach.jpg" alt="picture1" width="85" height="80" style="opacity:0.6;filter:alpha(opacity=40)"onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100"onmouseout="this.style.opacity=0.6;this.filters.alpha.opacity=40" </a><a href="picture1.jpg" onmouseover="return showme(this.href)"onmouseout="return hide(this.href)"><img src="picture1.jpg" alt="picture1" width="85" height="80" style="opacity:0.6;filter:alpha(opacity=40)"onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100"onmouseout="this.style.opacity=0.6;this.filters.alpha.opacity=40" </a></div></html> Link to comment Share on other sites More sharing options...
dsonesuk Posted October 12, 2010 Share Posted October 12, 2010 there are several ways to do thisset the img src to "", but this will result in a border square appearing with red x in top left corner in IE browsers.set display of img tag to display="none";, which will hide the img tag, completely, with src ref or not, but will cause thumbnail imge to jump up and down, when display change to display="none", and display="block" or display="".Best optionset display of img tag to visibility="hidden";, which will hide the img tag, completely, with src ref or not, but unlike display="none" it will remain at same position. whether visibility="hidden" or visibility="visible" are used.<a href="mablebeach.jpg" onmouseover="return showhide(this.href);" onmouseout="return showhide(this.href);"><img src="mablebeach.jpg" alt="picture1" width="85" height="80" style="opacity:0.6;filter:alpha(opacity=40)" onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100" onmouseout="this.style.opacity=0.6;this.filters.alpha.opacity=40" /></a><script type="text/javascript">/*<![CDATA[*//*---->*/window.onload=function (){var currentimage=document.getElementById("specimen");currentimage.src="";currentimage.style.visibility="hidden";}function showhide(href){var currentimage=document.getElementById("specimen");currentimage.style.visibility=="hidden" ? currentimage.style.visibility="visible" : currentimage.style.visibility="hidden";currentimage.src=href;return false;}/*--*//*]]>*/</script> Link to comment Share on other sites More sharing options...
jnf555 Posted October 13, 2010 Author Share Posted October 13, 2010 thanks for infojnf555 Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.