littlechris1977
11-14-2007, 02:50 PM
1) Script Title: <rollover script>
2) Script URL (on DD): www.gatewaybc.com
<script language="Javascript">
<!--
function toggleDiv(id,flagit) {
if (flagit=="1"){
if (document.layers) document.layers[''+id+''].visibility = "show"
else if (document.all) document.all[''+id+''].style.visibility = "visible"
else if (document.getElementById) document.getElementById(''+id+'').style.visibility = "visible"
}
else
if (flagit=="0"){
if (document.layers) document.layers[''+id+''].visibility = "hide"
else if (document.all) document.all[''+id+''].style.visibility = "hidden"
else if (document.getElementById) document.getElementById(''+id+'').style.visibility = "hidden"
}
}
//-->
</script>
3) Describe problem: The rollover works perfectly in IE, but in FF and Safari, when you mouseover the three images to the left the one on the right "jumps" from on to off
Here is the HTML for the "slideshow"
<table width="475" height="246" cellspacing="0" cellpadding="0" border="0" background="/clientimages/39242/template/slideshow-bg.jpg" style="background-repeat: no-repeat;" id="content-table">
<tbody>
<tr>
<td width="175" valign="top">
<div id="events"><a href="/templates/default.asp?id=39242&PG=Events" onmouseout="toggleDiv('slide1',0)" onmouseover="toggleDiv('slide1',1)"><img border="0" src="/clientImages/39242/template/events.jpg" alt="Events" /></a></div>
<div id="message"><a onmouseout="toggleDiv('slide2',0)" onmouseover="toggleDiv('slide2',1)" href="/templates/default.asp?id=39242&PID=464060"><img border="0" src="/clientImages/39242/template/message.jpg" alt="Messages" /></a></div>
<div id="groups"><a onmouseout="toggleDiv('slide3',0)" onmouseover="toggleDiv('slide3',1)" href="/templates/default.asp?id=39242&PID=464044"><img border="0" src="/clientImages/39242/template/groups.jpg" alt="Groups" /></a></div>
</td>
</tr>
</tbody>
</table>
<div id="slide1"><img src="/clientImages/39242/template/slide-1.jpg" alt="" /></div>
<div id="slide2"><img src="/clientImages/39242/template/slide-2.jpg" alt="" /></div>
<div id="slide3"><img src="/clientImages/39242/template/slide-3.jpg" alt="" /></div>
2) Script URL (on DD): www.gatewaybc.com
<script language="Javascript">
<!--
function toggleDiv(id,flagit) {
if (flagit=="1"){
if (document.layers) document.layers[''+id+''].visibility = "show"
else if (document.all) document.all[''+id+''].style.visibility = "visible"
else if (document.getElementById) document.getElementById(''+id+'').style.visibility = "visible"
}
else
if (flagit=="0"){
if (document.layers) document.layers[''+id+''].visibility = "hide"
else if (document.all) document.all[''+id+''].style.visibility = "hidden"
else if (document.getElementById) document.getElementById(''+id+'').style.visibility = "hidden"
}
}
//-->
</script>
3) Describe problem: The rollover works perfectly in IE, but in FF and Safari, when you mouseover the three images to the left the one on the right "jumps" from on to off
Here is the HTML for the "slideshow"
<table width="475" height="246" cellspacing="0" cellpadding="0" border="0" background="/clientimages/39242/template/slideshow-bg.jpg" style="background-repeat: no-repeat;" id="content-table">
<tbody>
<tr>
<td width="175" valign="top">
<div id="events"><a href="/templates/default.asp?id=39242&PG=Events" onmouseout="toggleDiv('slide1',0)" onmouseover="toggleDiv('slide1',1)"><img border="0" src="/clientImages/39242/template/events.jpg" alt="Events" /></a></div>
<div id="message"><a onmouseout="toggleDiv('slide2',0)" onmouseover="toggleDiv('slide2',1)" href="/templates/default.asp?id=39242&PID=464060"><img border="0" src="/clientImages/39242/template/message.jpg" alt="Messages" /></a></div>
<div id="groups"><a onmouseout="toggleDiv('slide3',0)" onmouseover="toggleDiv('slide3',1)" href="/templates/default.asp?id=39242&PID=464044"><img border="0" src="/clientImages/39242/template/groups.jpg" alt="Groups" /></a></div>
</td>
</tr>
</tbody>
</table>
<div id="slide1"><img src="/clientImages/39242/template/slide-1.jpg" alt="" /></div>
<div id="slide2"><img src="/clientImages/39242/template/slide-2.jpg" alt="" /></div>
<div id="slide3"><img src="/clientImages/39242/template/slide-3.jpg" alt="" /></div>