PDA

View Full Version : Not working in IE



jfreak53
07-30-2009, 05:59 PM
This code for changing an image on select on a form is working in everything but IE, what is wrong with my code?

Thanks in advance for any help.


<select name="skin">
<option <? if ($skin == "skins/default/"){ echo "selected"; }?> onClick="document.divimage.src = 'images/skinpreviews/defaultskin.jpg'">default</option>
<option <? if ($skin == "skins/silver/"){ echo "selected"; }?> onClick="document.divimage.src = 'images/skinpreviews/silverskin.jpg'">silver</option>
<option <? if ($skin == "skins/office2003/"){ echo "selected"; }?> onClick="document.divimage.src = 'images/skinpreviews/office2003skin.jpg'">office2003</option>
</select>

And here is the standard image tag that I am using that this points too:


<img src="images/skinpreviews/office2003skin.jpg" id="divimage" name="divimage" border=1>

The on click is what's not working correctly in IE.

jfreak53
07-30-2009, 08:09 PM
Never mind I did something else I just made a function and called it on change of the select in the form like this:


<script type="text/javascript">

function selectedOption() {
if (document.getElementById('default').selected == 1)
{
document.getElementById('divimage').src = 'images/skinpreviews/defaultskin.jpg';
}
else if (document.getElementById('silver').selected == 1)
{
document.getElementById('divimage').src = 'images/skinpreviews/silverskin.jpg';
}
else if (document.getElementById('office2003').selected == 1)
{
document.getElementById('divimage').src = 'images/skinpreviews/office2003skin.jpg';
}
}
</script>


<select id="skin" name="skin" onChange="selectedOption();">
<option id="default" >default</option>
<option id="silver" >silver</option>
<option id="office2003" >office2003</option>
</select>

rainarts
07-31-2009, 09:50 AM
Hi,

Here's a more complex script, that does same output like your last posted code. But can go across in different modes of browser.

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<meta http-equiv="Window-target" content="_top">
<title>Free Live Help!</title>
<script type="text/javascript">
<!--
var selectedOption = ( function( isSelect, imageID ) {
var isSelect = isSelect || 0;
var imageID = imageID || 0;
if ( isSelect && imageID ) {
var index = isSelect.selectedIndex;
var isPath = isSelect.options[ index ].value || isSelect.value;
var isImage;
(( isImage = document.getElementById( imageID )) ? null : isSelect = document.images[ imageID ] );
var isSrc = new Image();
isSrc.src = isPath;
isSrc = isSrc.src;
isImage.alt = String( isPath.match(/\w+(\.jpg|png|gif)$/i)[ 0 ] );
isImage = isSrc;
return;
} return false;
} );
// -->
</script>
</head>
<body>
<div id="main">
<form id="form1" name="form1" action="#" onsubmit="return false;">
<div>
<select id="skin" name="skin" size="1" onchange="selectedOption( this, 'divimage' );">
<option value="images/skinpreviews/defaultskin.jpg" selected>- default skin-</option>
<option value="images/skinpreviews/silverskin.jpg">- silver skin -</option>
<option value="images/skinpreviews/office2003skin.jpg">- office2003 skin -</option>
</select>
</div>
</form>
<div><img src="images/skinpreviews/office2003skin.jpg" alt="office2003 skin" id="divimage"></div>
</div>
</body>
</html>