|
Click to See Complete Forum and Search --> : rollover image using layers damon2003 07-07-2004, 05:10 AM hi, i have created some rollover images using layers in dreamweaver, they work but when the mouse is rollovered the image fast the rollover image tends to stick, is there a way round this? thanks Kor 07-07-2004, 05:45 AM using layers in dreamweaver as long as the code is correct, you may have use "The_Green_Frog" or "Whichever_Application" program but we don't help us (to help you) very much if we don't see the code. can we see the code, please?:D PS. I also use Dreamweaver, but only as a HTML editor (and I have to be careful sometimes) but I never use it as a javascript-ready-made-snippets builder. I prefere to build my code lines with my "bare hands":D damon2003 07-07-2004, 05:51 AM whats the green frog? the layers have been added at the bottom of the code. <html> <head> <script language="JavaScript" type="text/javascript" src="http://intranet.kusala.com/~damon/dev/eminox/web/menu/menu_scr.js"> </script> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <!-- TemplateBeginEditable name="doctitle" --> <title>Untitled Document</title> <!-- TemplateEndEditable --><!-- TemplateBeginEditable name="head" --><!-- TemplateEndEditable --> <link href="../web/eminox.css" rel="stylesheet" type="text/css"> <style type="text/css"> <!-- .style7 {color: #FFFFFF; font-size: 11px; font-weight: bold; font-family: Arial, Helvetica, sans-serif; } .style8 {font-weight: bold; font-family: Arial, Helvetica, sans-serif; font-size: 11px;} --> </style> <script language="JavaScript" type="text/JavaScript"> <!-- function MM_reloadPage(init) { //reloads the window if Nav4 resized if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) { document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }} else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload(); } MM_reloadPage(true); function MM_findObj(n, d) { //v4.01 var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document); if(!x && d.getElementById) x=d.getElementById(n); return x; } function MM_showHideLayers() { //v6.0 var i,p,v,obj,args=MM_showHideLayers.arguments; for (i=0; i<(args.length-2); i+=3) if ((obj=MM_findObj(args[i]))!=null) { v=args[i+2]; if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v=='hide')?'hidden':v; } obj.visibility=v; } } function MM_goToURL() { //v3.0 var i, args=MM_goToURL.arguments; document.MM_returnValue = false; for (i=0; i<(args.length-1); i+=2) eval(args[i]+".location='"+args[i+1]+"'"); } //--> </script> </head> <body> <table width="800" border="0" cellspacing="0" cellpadding="0"> <tr> <td><table width="800" border="0" cellspacing="0" cellpadding="0"> <tr> <td><a href="../web/index.php"><img src="../web/images/eminox.gif" width="80" height="101" border="0"></a></td> <td><img src="../web/images/top.gif" width="560" height="101"></td> <td rowspan="2"><table width="160" border="0" cellspacing="0" cellpadding="0"> <tr> <td height="20"><table width="100%" height="20" border="0" cellpadding="0" cellspacing="0"> <tr> <td><div align="center"></div></td> <td><div align="center"></div></td> </tr> </table></td> </tr> <tr> <td><img src="../web/images/topright.gif" width="160" height="105"></td> </tr> </table> </td> </tr> <tr> <td><img src="../web/images/lefttop.gif" width="80" height="24"></td> <td valign="top"><table id="m1mainSXMenu2" cellspacing="1" cellpadding="2" class="x1" border="0" > <tr align="left"> <td onmouseover="chgBg(m1,'m1tlm0',3);exM(m1,'none','',event)" onmouseout="chgBg(m1,'m1tlm0',0,1)" id="m1tlm0" class="m1mit" bgcolor="#C0C0C0"> <a id="m1tlm0a" class="m1CL0" href="http://intranet.kusala.com/~damon/dev/eminox/web/about_us" > <div class='topFold'>About Us</div></a></td> <td onmouseover="chgBg(m1,'m1tlm1',3);exM(m1,'m1mn1','m1tlm1',event)" onmouseout="chgBg(m1,'m1tlm1',0);coM(m1,'m1mn1')" id="m1tlm1" class="m1mit" bgcolor="#C0C0C0"> <a id="m1tlm1a" class="m1CL0" href="http://intranet.kusala.com/~damon/dev/eminox/web/products_services/" onMouseOver="exMNS(m1,'m1mn1',event)" onmouseout="coMNS(m1,'m1mn1')" > <div id='m1mn1top' class='topFold'>Products & Services</div></a></td> <td onmouseover="chgBg(m1,'m1tlm2',3);exM(m1,'m1mn2','m1tlm2',event)" onmouseout="chgBg(m1,'m1tlm2',0);coM(m1,'m1mn2')" id="m1tlm2" class="m1mit" bgcolor="#C0C0C0"> <a id="m1tlm2a" class="m1CL0" href="http://intranet.kusala.com/~damon/dev/eminox/web/customer_service/" onMouseOver="exMNS(m1,'m1mn2',event)" onmouseout="coMNS(m1,'m1mn2')" > <div id='m1mn2top' class='topFold'>Customer Services</div></a></td> <td onmouseover="chgBg(m1,'m1tlm3',3);exM(m1,'m1mn3','m1tlm3',event)" onmouseout="chgBg(m1,'m1tlm3',0);coM(m1,'m1mn3')" id="m1tlm3" class="m1mit" bgcolor="#C0C0C0"> <a id="m1tlm3a" class="m1CL0" href="http://intranet.kusala.com/~damon/dev/eminox/web/customers" onMouseOver="exMNS(m1,'m1mn3',event)" onmouseout="coMNS(m1,'m1mn3')" > <div id='m1mn3top' class='topFold'>Customers</div></a></td> <td onmouseover="chgBg(m1,'m1tlm4',3);exM(m1,'m1mn4','m1tlm4',event)" onmouseout="chgBg(m1,'m1tlm4',0);coM(m1,'m1mn4')" id="m1tlm4" class="m1mit" bgcolor="#C0C0C0"> <a id="m1tlm4a" class="m1CL0" href="http://intranet.kusala.com/~damon/dev/eminox/web/locations" onMouseOver="exMNS(m1,'m1mn4',event)" onmouseout="coMNS(m1,'m1mn4')" > <div id='m1mn4top' class='topFold'>Locations</div></a></td> <td onmouseover="chgBg(m1,'m1tlm5',3);exM(m1,'none','',event)" onmouseout="chgBg(m1,'m1tlm5',0,1)" id="m1tlm5" class="m1mit" bgcolor="#C0C0C0"> <a id="m1tlm5a" class="m1CL0" href="http://intranet.kusala.com/~damon/dev/eminox/web/industry_news" > <div class='topFold'>Industry News</div></a></td></tr></table></td> </tr> <tr> <td><img src="../web/images/left.gif" width="80" height="365"></td> <td valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td> </td> <td> </td> <td> </td> </tr> <tr> <td width="14%"><img src="../web/images/spacer60.gif" width="60" height="1"></td> <td width="83%"><!-- TemplateBeginEditable name="content" -->editablea <!-- TemplateEndEditable --></td> <td width="3%"><img src="../web/images/spacer60.gif" width="60" height="1"></td> </tr> </table> </td> </tr> <tr> <td> </td> <td><div align="center"></div></td> <td> </td> </tr> <tr> <td> </td> <td class="contacttitle"><div align="center">Stoke on Trent </div></td> <td> </td> </tr> <tr> <td> </td> <td class="contacttext"><div align="center">Eminox Ltd, Brick Kiln, Basford, Stoke on Trent, Staffordshire</div></td> <td> </td> </tr> <tr> <td> </td> <td class="contacttext"><div align="center">ST4 7BS </div></td> <td> </td> </tr> <tr> <td> </td> <td class="contacttext"><div align="center">Tel: +44(0) 1782 206300 </div></td> <td> </td> </tr> <tr> <td> </td> <td class="contacttext"><div align="center">Fax: +44(0) 1782 283800 </div></td> <td> </td> </tr> </table> </td> </tr> <tr> <td background="../web/images/bottom.gif" height="54" colspan="3"><table width="800" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="60"> </td> <td> </td> </tr> </table></td> </tr> </table> </td> </tr> </table> <div id="Layer1" style="position:absolute; width:59px; height:13px; z-index:1; left: 640px; top: 0px; visibility: visible;" onMouseOver="MM_showHideLayers('Layer1','','hide','Layer2','','show')"><img src="../web/images/pr_eventsbutton.gif" width="80" height="20" ></div> <div id="Layer2" style="position:absolute; width:69px; height:19px; z-index:2; left: 640px; top: 0px; visibility: hidden;" onMouseOut="MM_showHideLayers('Layer1','','show','Layer2','','hide')" onClick="MM_goToURL('parent','../web/pr_events/index.php');return document.MM_returnValue"><img src="../web/images/pr_eventsbuttonover.gif" width="80" height="20" style="cursor:pointer "></div> <div id="Layer3" style="position:absolute; width:51px; height:4px; z-index:3; left: 720px; top: 0px; visibility: visible;" onMouseOver="MM_showHideLayers('Layer3','','hide','Layer4','','show')"><img src="../web/images/recruitmentbutton.gif" width="80" height="20"></div> <div id="Layer4" style="position:absolute; width:7px; height:0px; z-index:4; left: 720px; top: 0px; visibility: hidden;" onMouseOut="MM_showHideLayers('Layer3','','show','Layer4','','hide')" onClick="MM_goToURL('parent','../web/recruitment/index.php');return document.MM_returnValue"><img src="../web/images/recruitmentbuttonover.gif" width="80" height="20" style="cursor:pointer "></div> </body> </html> Kor 07-07-2004, 06:13 AM The code looks ok (even, as one of my friends said once "it's a heluva intricate Mickey Mouse type of code - as MM is also MacroMedia 'signature' ):D ... I hope that the rest (you have other external js files) is OK So, your problem: Could be some explanations, none of them directly related with javascript itself. 1. Browsers have a limit (75 ms) of repeted actions/functions. If below that, CP is "overflooded"... yet I don't think is your case, I don't imagine your speed is so high... 2. Wait till the page is fully loaded. Maybe the preloader had no time to do its job, so the second image is not loaded (which may give even a javascript error) 3.check if the layers are same size (I see they are not). If not, the roll on/off will work only when mouse is over/out the precise shape of each layer. whats the green frog? a green frog is a... green frog, what else ? :D :D :D It was only a joke. I wanted to say that it does not matter which is the program to help you buid a code, so the fact that you mentioned Dreamwever has no real relevance... :D webdeveloper.com
Copyright Internet.com Inc., All Rights Reserved. |
|