View Full Version : Toggle DIV Help

07-09-2007, 09:59 PM

The following page - https://www.balticmill.com/shop/ProductDetails.tmp.php?firstLevelCatID=9&secondLevelCatID=23&productID=54 - contains a button next to "Email a friend" that when clicked displays a hidden div. On Firefox it displays fine, but on IE the graphic for the send button does not display. However, when I try the code locally it works fine. Any ideas? Apologies for the formatting I've tried to make it look half decent for display here.

What I don't get is that the SRC for the send image is fine - https://www.balticmill.com/images/newShopImages/RedArrow.png - that path exists, but it doesn't display anything. When I make the DIV that it is in either not hidden or move the send button code outside of the hidden DIV it works fine. When I run it all from my hard drive it all works fine and the online page works fine in Firefox.

The code is as follows (a subset of that page):

<title>Test toggle</title>
<script type="text/javascript" language="javascript">

function toggleSlide(objname1,objname2){

if(document.getElementById(objname1).style.display == "none"){

var browserDetails = navigator.userAgent;

if (browserDetails.indexOf('Firefox') != -1) {
document.getElementById(objname1).style.display = "inline";
else {
document.getElementById(objname1).style.display = "inline-block";

document.getElementById(objname1).style.display = "none";

if(document.getElementById(objname2).style.display == "none"){
document.getElementById(objname2).style.display = "block";
document.getElementById(objname2).style.display = "none";

<link href="https://www.balticmill.com/includes/newShopStyles.css"
rel="stylesheet" type="text/css">
<div class="red_bold_12 marginTop10px floatLeft">Email a friend

<a href="javascript:;" onmousedown="toggleSlide
<img src="https://www.balticmill.com/images/newShopImages/
RedArrow.png" width="14" height="14" class="marginTop10px" /></a>

<div id="emailFriend" style="display:none">
<tr><td valign="top" align="left">
<h1 class="width100MarginBottom10">Email A Friend</h1></td></tr>
<tr><td valign="top" align="left">
<div class="width100MarginBottom10">To:</div></td><td>
<input type="text" id="toEmail" name="toEmail" size="28" /></td></tr>
<tr><td valign="top" align="left">
<div class="width100MarginBottom10">From:</div></td><td>
<input type="text" id="fromEmail" name="fromEmail" size="28 " /></td></tr>
<tr><td valign="top" align="left">
<div class="width100MarginBottom10">
Comments:</div></td><td><textarea id="messageBox"
name="messageBox" rows="5" cols="28"></textarea></td></tr>

<div><span class="red_bold_12"

<img src="https://www.balticmill.com/images/newShopImages/RedArrow.png" style="display:none" name="send" id="send" width="14" height="14" class="marginTop10px" /></span></div>