Rotate the Opacity

[Total: 0    Average: 0/5]

This will rotate the opactiy setting of the div.

Head Code:

<style>
#mydiv
{
  width:100%;
  height:100%;
  filter:alpha(opacity=10);
}
</style>
<script>
var value=  0; /* current opacity setting */
var plus =  1; /* going up */
var minus=  0; /* going up */
var delta=  5; /* change by each time */
var MAX  = 90; /* max value */
var MIN  = 10; /* min value */
var INVL =200; /* msecs between changes */

function IE()
{
  if (value<MAX && plus)
    value+=delta;
  else
  {
    plus =0; /* going down */
    minus=1; /* going down */
  }
  if(value>MIN && minus)
    value-=delta;
  else
  {
    plus =1; /* going up */
    minus=0; /* going up */
  }
  document.getElementById("mydiv").filters[0].opacity=value;
}

function MOZ()
{
  if(value<MAX && plus)
    value+=delta;
  else
  {
    plus =0; /* going down */
    minus=1; /* going down */
  }
  if(value>MIN && minus)
    value-=delta;
  else
  {
    plus =1; /* going up */
    minus=0; /* going up */
  }
  /* for MOZ - must change to a percent value */
  value2=value/100;
  document.getElementById("mydiv").style.MozOpacity=value2;
}

/* if its mozilla */
if (window.sidebar)
{
  setInterval("MOZ()",INVL);
}

/* if its IE */
if (document.all)
{
  setInterval("IE()",INVL);
}
</script>

Body Code:

<div id=mydiv>
  This is text inside my div.<BR />
  <img id=mypic src="http://www.js-examples.com/images/jsx_logo.gif">
</div>

Times Viewed: 0

Leave a Reply

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