how do i add a timer into a fade in fade out javascript for it to run automatically?
<p>This is my code.</p>

<pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
&lt;head&gt;
&lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt;
&lt;title&gt;Fading JavaScript Example&lt;/title&gt;
&lt;link rel="stylesheet" type="text/css" href="style.css" /&gt;
&lt;script type="text/javascript"&gt;

 var fadeEffect=function(){
return{
    init:function(id, flag, target){
        this.elem = document.getElementById(id);
        clearInterval(this.elem.si);
        this.target = target ? target : flag ? 100 : 0;
        this.flag = flag || -1;
        this.alpha = this.elem.style.opacity ? parseFloat(this.elem.style.opacity) * 100 : 0;
        this.si = setInterval(function(){fadeEffect.tween()}, 30);
    },
    tween:function(){
        if(this.alpha == this.target){
            clearInterval(this.si);
        }else{
            var value = Math.round(this.alpha + ((this.target - this.alpha) * .07)) + (1 * this.flag);
            this.elem.style.opacity = value / 100;
            this.elem.style.filter = 'alpha(opacity=' + value + ')';
            this.alpha = value

        }
    }
}
}();

var fadeEffect2=function(){
return{
    init:function(id, flag, target){
        this.elem = document.getElementById(id);
        clearInterval(this.elem.si);
        this.target = target ? target : flag ? 100 : 0;
        this.flag = flag || -1;
        this.alpha = this.elem.style.opacity ? parseFloat(this.elem.style.opacity) * 100 : 0;
        this.si = setInterval(function(){fadeEffect2.tween()}, 30);
    },
    tween:function(){
        if(this.alpha == this.target){
            clearInterval(this.si);
        }else{
            var value = Math.round(this.alpha + ((this.target - this.alpha) * .07)) + (1 * this.flag);
            this.elem.style.opacity = value / 100;
            this.elem.style.filter = 'alpha(opacity=' + value + ')';
            this.alpha = value

        }
    }
}
 }();
var fadeEffect3=function(){
return{
    init:function(id, flag, target){
        this.elem = document.getElementById(id);
        clearInterval(this.elem.si);
        this.target = target ? target : flag ? 100 : 0;
        this.flag = flag || -1;
        this.alpha = this.elem.style.opacity ? parseFloat(this.elem.style.opacity) * 100 : 0;
        this.si = setInterval(function(){fadeEffect3.tween()}, 30);
    },
    tween:function(){
        if(this.alpha == this.target){
            clearInterval(this.si);
        }else{
            var value = Math.round(this.alpha + ((this.target - this.alpha) * .07)) + (1 * this.flag);
            this.elem.style.opacity = value / 100;
            this.elem.style.filter = 'alpha(opacity=' + value + ')';
            this.alpha = value

        }
    }
}
}();


&lt;/script&gt;

&lt;/head&gt;
&lt;body&gt;

&lt;div id="wrapper"&gt;
&lt;div id="fade"&gt;&lt;/div&gt;

&lt;div id="fade1"&gt;&lt;/div&gt;

&lt;div id="fade2"&gt;
&lt;div class="link"&gt; &lt;a href="http://www.your_link.com" style="display:block; height:100%;    width:100%;"&gt;&lt;/a&gt;&lt;/div&gt;

&lt;/div&gt;

&lt;/div&gt;

&lt;div class="button" onclick="fadeEffect.init('fade', 1);fadeEffect2.init('fade1',0);fadeEffect3.init('fade2',0);myFunction()"&gt;pic 1&lt;/div&gt;
&lt;div class="button" onclick="fadeEffect.init('fade',0);fadeEffect2.init('fade1',1);fadeEffect3.init('fade2',0)"&gt;pic 2&lt;/div&gt;
&lt;div class="button" onclick="fadeEffect.init('fade',0);fadeEffect2.init('fade1',0);fadeEffect3.init('fade2',1)"&gt;pic 3&lt;/div&gt;

&lt;/body&gt;
&lt;/html&gt;
</code></pre>

<p>I'm new to javascript. I can fade the image using the buttons but i want it to fade in and out automatically with a timer when untouched. Or if theres any easier way to go about doing this I'll appreciate it.</p>
