A scopo didattico:
Codice PHP:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script language="JavaScript" type="text/JavaScript">
/* by html.it ;) */
function preloadImgs(args) {
for(var n=0;n<arguments.length;n++) {
preloadImg(arguments[n]);
}
//funzione che precarica un immagine
function preloadImg(percorso) {
var temp=new Image();
temp.src=percorso;
}
}
function _removeChild(parent,child){
if(child != null){
parent.removeChild(child);
}
};
function changeImg(el){
var ext= '.png';
var target= document.getElementById("target");
if(!target){return;}
var optionValue = el.options[el.selectedIndex].value;
var currentImage= optionValue.concat(ext);
var img = document.createElement("img");
img.src= currentImage;
var tmp= target.getElementsByTagName('img').item(0);
_removeChild(target,tmp);
target.appendChild(img);
}
window.onload = function(){
preloadImgs('volvo.png','saab.png','opel.png','audi.png');
var sel = document.getElementById("my-select");
sel.onchange=function(){
changeImg(sel);
}
}
</script>
</head>
<body>
<form id="frm" action="" method="post">
<select name="myselect" id="my-select" size="1">
<option value ="volvo">Volvo</option>
<option value ="saab">Saab</option>
<option value ="opel">Opel</option>
a<option value ="audi">Audi</option>
</select>
</form>
<div id="target"></div>
</body>
</html>
Rispondi quotando
