topical media & game development

talk show tell print

graphic-javascript-effect-image-text-effect.htm / htm



  
  <!-- TWO STEPS TO INSTALL EXPANDING TEXT IMAGES:
  
    1.  Copy the coding into the HEAD of your HTML document
  
    2.  Add the last code into the BODY of your HTML document  -->
  
  <!-- STEP ONE: Paste this code into the HEAD of your HTML document  -->
  
  <HEAD>
  
  <!-- This script and many more are available free online at -->
  
  <!-- The JavaScript Source!! http://javascript.internet.com -->
  
  <!-- Original:  Indraswara  (indraswara@yahoo.com) -->
  
  <!-- Web Site:  http://askindra.cjb.net -->
  
  <style>
  
  <!--
  
  .Newpost { position: absolute; left: 240; top: 20; }
  
  .Oldpost { position: absolute; left: 268; top: 20; z-index: 1; }
  
  .JPost { position: absolute; left: 78; top: 20; }
  
  .APost { position: absolute; left: 114; top: 20; z-index: 1; }
  
  .VPost { position: absolute; left: 150; top: 20; }
  
  .AAPost { position: absolute; left: 186; top: 20; }
  
  .SPost { position: absolute; left: 222; top: 20; }
  
  .CPost { position: absolute; left: 258; top: 20; }
  
  .RPost { position: absolute; left: 294; top: 20; }
  
  .IPost { position: absolute; left: 330; top: 20; }
  
  .PPost { position: absolute; left: 366; top: 20; }
  
  .TPost { position: absolute; left: 402; top: 20; }//-->
  
  </style>
  
  </HEAD>
  
  <!-- STEP TWO: Copy this code into the BODY of your HTML document  -->
  
  <BODY>
  
  <!-- This script and many more are available free online at -->
  
  <!-- The JavaScript Source!! http://javascript.internet.com -->
  
  <!-- Original:  Indraswara  (indraswara@yahoo.com) -->
  
  <!-- Web Site:  http://askindra.cjb.net -->
  
  <div style="position: absolute; top: 102; left: 111; width: 396; height: 16">
  
  <a href="http://www.javascript.internet.com" 
  
  onmouseover="document.lj.className='JPost'; 
  
  document.la.className='APost'; 
  
  document.lv.className='VPost';
  
  document.laa.className='AAPost';
  
  document.ls.className='SPost';
  
  document.lc.className='CPost';
  
  document.lr.className='RPost';
  
  document.li.className='IPost';
  
  document.lp.className='PPost';
  
  document.lt.className='TPost';" 
  
  onmouseout="document.lj.className='NewPost';
  
  document.la.className='NewPost';
  
  document.lv.className='NewPost';
  
  document.laa.className='NewPost';
  
  document.ls.className='OldPost';
  
  document.lc.className='NewPost';
  
  document.lr.className='NewPost';
  
  document.li.className='NewPost';
  
  document.lp.className='NewPost';
  
  document.lt.className='NewPost';" style="text-decoration: none;"><b><font face="Arial Black">MOUSE YOUR MOUSE OVER THIS TEXT</font></b></a></div>
  
  <img border="0" src="graphic-javascript-effect-image-text-lettera.gif" name="la" class="NewPost" width="60" height="60">
  
  <img border="0" src="graphic-javascript-effect-image-text-letterv.gif" name="lv" class="NewPost" width="60" height="60">
  
  <img border="0" src="graphic-javascript-effect-image-text-lettera.gif" name="laa" class="NewPost" width="60" height="60">
  
  <img border="0" src="graphic-javascript-effect-image-text-letters.gif" name="ls" class="OldPost" width="60" height="60">
  
  <img border="0" src="graphic-javascript-effect-image-text-letterc.gif" name="lc" class="NewPost" width="60" height="60">
  
  <img border="0" src="graphic-javascript-effect-image-text-letterr.gif" name="lr" class="NewPost" width="60" height="60">
  
  <img border="0" src="graphic-javascript-effect-image-text-letteri.gif" name="li" class="NewPost" width="60" height="60">
  
  <img border="0" src="graphic-javascript-effect-image-text-letterp.gif" name="lp" class="NewPost" width="60" height="60">
  
  <img border="0" src="graphic-javascript-effect-image-text-lettert.gif" name="lt" class="NewPost" width="60" height="60">
  
  <img border="0" src="graphic-javascript-effect-image-text-letterj.gif" name="lj" class="NewPost" width="60" height="60">
  
  <div style="width: 536; height: 78; position: absolute; left: 13; top: 173"><font face="Arial" color="#FFFFFF"><pre>Download and extract the text images from this URL :
  
  <a href="http://www.geocities.com/indraswara/letter.zip">Download the letter images here</a>
  
  and place them in a folder named "images" </pre></font>
  
  </div>
  
  <p><center>
  
  <font face="arial, helvetica" size"-2">Free JavaScripts provided<br>
  
  by <a href="http://javascriptsource.com">The JavaScript Source</a></font>
  
  </center><p>
  
  <!-- Script Size:  3.83 KB -->
  


(C) Æliens 20/2/2008

You may not copy or print any of this material without explicit permission of the author or the publisher. In case of other copyright issues, contact the author.