DHTML

Moving Background
Moving Objects
Rollover
Pulldown Menu
Preloading
Drag'n'Drop
Scrolling Text
Teletype
Shoot Me!
Animation
ActiveX
Opacity
Transition
Mad Bubbles
Gates

JavaScript


Books

Russian | Main Page


Useful links: 2025 vs 2032 в чем разница между батарейками 2025 и 2032.






Opacity | Description

If you want to use any of this examples, please put a link to our site.
Here you can find HTML-code for such link.
<html>
<head>
<title>www.redmount.com - DHTML - Opacity</title>
<script  language=javascript>
<!--
//global variables
  var p=parent,v='test',x1=130,x2=50,v1=0.5,v2=-1,steps1=107,steps2=133,s1=0,s2=0;
  var browser='NN';
  function init()
  {
    layerRef="document.all";
    styleSwitch=".style";
    start();
  }
//-->
</script>
<script language=jscript>
<!--
  browser="IE";
//-->
</script>
<style type="text/css">
#text {position: absolute;  visibility: visible;  left: 15; top: 220; z-index: -1;}
#moon {position: absolute;  visibility: visible;  left: 130; top: 50; z-index: -1; width: 1;}
#cloud1 {position: absolute;  visibility: visible; left: 50; top: 10; width: 1; z-index: 2; filter:Alpha(Opacity=60, Style=0)}
#cloud2 {position: absolute;  visibility: visible; left: 70; top: 120; width: 1; z-index: 3; filter:Alpha(Opacity=80, Style=0)}
</style>
</head>

<body onLoad=init() bgcolor=black text=white vlink=silver leftmargin=30 link=white vlink=white alink=white>
<script language=javascript>
<!--
  if (browser=='NN')
    location.href='net_sory.html';
//-->
</script>

<script language="JavaScript">
<!--
//GENERAL FUNCTIONS
    function moveLayerTo(layername,left)
    {
//      alert(left);
      eval(layerRef+'["'+layername+'"]'+styleSwitch+'.left=left');
    }
  
    function start()
    {
      s1++;s2++;
      if(s1>steps1)
      {
        v1=v1*-1;
        s1=0;
      }
      if(s2>steps2)
      {
        v2=v2*-1;
        s2=0;
      }

      x1=x1+v1*Math.round(Math.random()*2);
      x2=x2+v2*Math.round(Math.random()*2);

      eval('moveLayerTo("cloud1",'+x1+')');
      eval('moveLayerTo("cloud2",'+x2+')');
      setTimeout("start()",eval(6));
    }
// -->
</script>


<div id="text">Text</div>

<div id=moon><img src="moon.gif" border=0></div>
<div id=cloud1><img src="cloud1.gif" border=0></div>
<div id=cloud2><img src="cloud2.gif" border=0></div>

</body>
</html>