Closed Thread Icon

Topic awaiting preservation: Script loading without having to use the mouse (Page 1 of 1) Pages that link to <a href="https://ozoneasylum.com/backlink?for=8798" title="Pages that link to Topic awaiting preservation: Script loading without having to use the mouse (Page 1 of 1)" rel="nofollow" >Topic awaiting preservation: Script loading without having to use the mouse <span class="small">(Page 1 of 1)</span>\
 
Anne Marie
Nervous Wreck (II) Inmate

From: United Kingdom
Insane since: Aug 2003

 posted posted 08-06-2003 12:04

Hi everyone
I hope someone can help me here , I'm very new to web page building but I have an opacity script that I managed to make work on text and it gives a nice fade into view effect when the mouse is moved over it.

I'm building my first ever webpage and wanted to have this effect on all the text sections without using the mouse to activate it.
Can anyone help me please?
I've included the full script so that you can see the what its doing.

<head>
<script>
var w3c=(document.getElementById)?true:false;
var ns4=(document.layers)?true:false;
var ie4=(document.all && !w3c)?true:false;
var ie5=(document.all && w3c)?true:false;
var ns6=(w3c && navigator.appName.indexOf("Netscape")>=0)?true:false;
var idlist=new Array();
function addFadeObject(el,starto,endo,step,timePerStep){
if(!ns4){
var idx=idlist.length;
idlist[idx]=(ie4)? document.all[el]:document.getElementById(el);
idlist[idx].idx=idx;
idlist[idx].starto=starto;
idlist[idx].endo=endo;
idlist[idx].step=step;
idlist[idx].timePerStep=timePerStep;
idlist[idx].T=0;
idlist[idx].Ostep=0;
idlist[idx].Ocount=0;
if(ie4&#0124; &#0124;ie5)idlist[idx].style.filter="alpha(opacity="+starto+")";
if(ns6)idlist[idx].style.MozOpacity=starto/100;
idlist[idx].onmouseover=function(){
clearInterval(this.T);
this.Ocount=this.starto;
this.Ostep=(this.starto<this.endo)?this.step:-this.step;
this.T=setInterval('adjop('+idx+')', this.timePerStep);
}
idlist[idx].onmouseout=function(){
clearInterval(this.T);
this.Ocount=this.endo;
this.Ostep=(this.starto<this.endo)?-this.step:this.step;
this.T=setInterval('adjop('+idx+')', this.timePerStep);
}
}}

function adjop(n){
var el=idlist[n];
if(ie4&#0124; &#0124;ie5)el.style.filter="alpha(opacity="+el.Ocount+")";
if(ns6)el.style.MozOpacity=el.Ocount/100;
el.Ocount+=el.Ostep;
if( ((el.starto<el.endo)&&((el.Ocount<el.starto)&#0124; &#0124;(el.Ocount>el.endo))) &#0124; &#0124; ((el.starto>el.endo)&&((el.Ocount>el.starto)&#0124; &#0124;(el.Ocount<el.endo))) )clearInterval(el.T);
}
</script>
</head>
<body bgcolor="#FFFFFF">
<p>&nbsp;
<div id="txt1" class="fadetext" style="width: 944; height: 43">
<p align="center"><b><font size="6" face="Arial">Example of text fading into view when page
loads</font></b>
</div>
<script>
new addFadeObject('txt1', 25, 100, 10 , 40);
</script>
</body>


Hope someone can help me as i cant really move on till this is done.
Thank you.
lallous
Paranoid (IV) Inmate

From: Lebanon
Insane since: May 2001

 posted posted 08-06-2003 13:12
code:
<script>

function mo(idx)

{

  var ob = idlist[idx];

  clearInterval(ob.T);

  ob.Ocount = ob.starto;

  ob.Ostep=(ob.starto<ob.endo)?ob.step:-ob.step;

  ob.T = setInterval('adjop('+idx+')', ob.timePerStep);

}

x = new addFadeObject('txt1', 25, 100, 10 , 60);

</script>

<input type='button' onclick='mo(0)' value='click me'>



Add this code just after your </div> tag.

Elias

[This message has been edited by lallous (edited 08-06-2003).]
Anne Marie
Nervous Wreck (II) Inmate

From: United Kingdom
Insane since: Aug 2003

 posted posted 08-06-2003 18:28

Thank you very much for responding to my call for help Elias.
But the script you gave me unfortunatly creates a *button* for activating the fade effect.
What I am after is a solution that will make the text on the page ..(and ONLY ) the text NOT the whole page...fade into view when the page opens WITHOUT having to click buttons or links.....a kind of automatic text fader if you see my point?

I have to say though I am very appreciative of your response.I do hope you can still help me.
AM
hyperbole
Paranoid (IV) Inmate

From: Madison, Indiana, USA
Insane since: Aug 2000

 posted posted 08-07-2003 00:41

Get rid of the line <input type='button' onclick='mo(0)' value='click me'>.

Try using <body .... onload="mo(0)"> instead.

-- not necessarily stoned... just beautiful.


[This message has been edited by hyperbole (edited 08-07-2003).]
Anne Marie
Nervous Wreck (II) Inmate

From: United Kingdom
Insane since: Aug 2003

 posted posted 08-07-2003 04:05

You guys really helped me out alot THANK YOU so much sadly the script doesnt seem to agree with a slower PC and lags quiet badly.....(it isnt very smooth i mean)
I found another script that may be better ...looks to me like a simple transition but it can be made to fade in *JUST* the text if its wrapped in some <DIV> tags as you can see.
Again i would like it to operate without using mouseover or clicking a link button etc.....simply by opening the page should make it fade into view.
Fingers crossed

<div>
<DIV id=mytransition
style="BORDER-RIGHT: black 1px solid;
BORDER-TOP: black 1px solid;
FILTER: revealTrans(duration=3,transition=0) blendTrans(duration=3);
BORDER-LEFT: black 1px solid;
WIDTH: 100%;
BORDER-BOTTOM: black 1px solid;
HEIGHT: 4%"></DIV>
<SCRIPT>
function fadein(){
if (cur!='x'){
}
else{
mytransition.filters.blendTrans.apply()
mytransition.innerHTML='<p align="center"><big><font face="Verdana">This is a sample document. </font></big></p>'
mytransition.filters.blendTrans.play()
}
}
</SCRIPT>

<!--- ***********The BELOW script is for the link to activate the fadein script************--->

<SCRIPT>
function changecolor(x){
if (event.srcElement.tagName=="SMALL"){
if (event.srcElement.style.color=="purple")
return
event.srcElement.style.color=x
}
}
function doit(){
if (event.srcElement.tagName=="SMALL"){
cur=event.srcElement.n
fadein()
}
}
</SCRIPT>
<DIV onclick="('');doit()"><SMALL n="x">Click Here</SMALL>
</div>

PS Tried the onload script on this but ....no joy....Sorry to be a pain regarding this.

« Backwards — Onwards »

Show Forum Drop Down Menu