Change Look and Read

[Total: 0    Average: 0/5]

This script shows how to have text altered as well as the CSS properties changed by mouse overs and clicks.

Head Code:

<script language="JavaScript"><!--
function swapIt(img, src) {
document.images[img].src = src;
}

function writetoLyr(id, message) {
  if (document.layers)
  {
    document.layers[id].document.write(message);
    document.layers[id].document.close();
  }
  else if (document.all)
  {
    eval("document.all."+id+".innerHTML='"+message+"'");
  }
  else
  {
    document.getElementById(id).innerHTML = message;
  }
}
// -->
</script>
<style type="text/css"><!--
.mydiv2 {position: absolute;
        visibility: visible;
                z-index: 1;
                border-width: 1px;
                border-style: solid;
       }
#d3 { top: 118px; left: 268px; width: 81px;  height: 87px; color: darkred; font-size: 20px;}
#d4 { top: 203px; left: 261px; width: 122px; height: 62px; color:darkblue; font-size: 25px;}-->
</style>

Body Code:

<div id="d1" class=mydiv1>&nbsp;</div> 
<div id="d2" class=mydiv1>&nbsp;</div>
<script>
var slap_me ='<span id=d3 class=mydiv2>Slap me!!</span>';
var smack_me='<span id=d4 class=mydiv2>Smack me!!</span>';
var another_msg='<span id=d4 class=mydiv2>Another Message</span>';
writetoLyr('d1',smack_me);
</script>
<a href="#" 
   onmouseover="swapIt('img1', 'http://www.js-x.com/js/pic1.gif'); writetoLyr('d1',slap_me);" 
   onmouseout ="swapIt('img1', 'http://www.js-x.com/js/pic3.gif'); writetoLyr('d1',smack_me);"
><img id="img1" name="img1" src="http://www.js-x.com/js/pic3.gif" border="0"></a> 
<BR>
<a href="javascript:writetoLyr('d1',another_msg)">make it be another message</a>

Times Viewed: 0

Leave a Reply

Your email address will not be published. Required fields are marked *