View Full Version : How can I get this two JavaScript to work together?
Grim Santo
03-20-2003, 07:39 AM
I am trying to get a news ticker and Image fader to work on the same page. Every time I get the news ticker to work the Image fader does not.
Here is the scripts i am working with:
:The Image Fader:
<script language="JavaScript">
<!--
var image1=new Image()
image1.src="../../images/reviews/buffy/buffy10.gif"
var image2=new Image()
image2.src="../../images/reviews/buffy/buffy1.gif"
var image3=new Image()
image3.src="../../images/reviews/buffy/buffy2.gif"
var image4=new Image()
image4.src="../../images/reviews/buffy/buffy3.gif"
var image5=new Image()
image5.src="../../images/reviews/buffy/buffy4.gif"
var image6=new Image()
image6.src="../../images/reviews/buffy/buffy6.gif"
var image7=new Image()
image7.src="../../images/reviews/buffy/buffy7.gif"
var image8=new Image()
image8.src="../../images/reviews/buffy/buffy8.gif"
var image9=new Image()
image9.src="../../images/reviews/buffy/buffy9.gif"
//-->
</script>
<body onLoad="slideit()">
<a onMouseover="window.status='Click To View Images.';return true" onMouseout="window.status=''" target="_self" title="Click To View Images." href="javascript:slidelink()">
<img src="../../images/reviews/click.gif" name="slide" border=0 style="filter:blendTrans(duration=3)" width="188" height="132"></a>
<script>
<!--
////change number of images below
var number_of_images=9
//change speed below (in seconds)
var speed=1
var step=1
var whichimage=1
function slideit(){
if (!document.images)
return
if (document.all)
slide.filters.blendTrans.apply()
document.images.slide.src=eval("image"+step+".src")
if (document.all)
slide.filters.blendTrans.play()
whichimage=step
if (step<number_of_images)
step++
else
step=1
if (document.all)
setTimeout("slideit()",speed*1000+3000)
else
setTimeout("slideit()",speed*1000)
}
function slidelink(){
if (whichimage==1)
window.location="btvspics.htm"
else if (whichimage==2)
window.location="btvspics.htm"
else if (whichimage==3)
window.location="btvspics.htm"
else if (whichimage==4)
window.location="btvspics.htm"
else if (whichimage==5)
window.location="btvspics.htm"
else if (whichimage==6)
window.location="btvspics.htm"
else if (whichimage==7)
window.location="btvspics.htm"
else if (whichimage==8)
window.location="btvspics.htm"
else if (whichimage==9)
window.location="btvspics.htm"
else if (whichimage==10)
window.location="btvspics.htm"
}
//-->
</script>
:And the News Ticker:
<td width="72%"><div style="position:relative;width:487; height:24;overflow:hidden; margin:0px;"><div id="spage" style="position:relative; width:487; height:24; background: #626262; overflow:hidden; FILTER: progid:DXImageTransform.Microsoft.GradientWipe(GradientSize=0.25,wipestyle=1,motion=forward,duration =1);"></div><script language="javascript" src="../../headline.js"></script></div></td>
Thanks In Advance for any help.
Santos
glenngv
03-20-2003, 09:31 AM
this is a common mistake for integrating 2 scripts that run onload. you need to check that there is only 1 window onload event handler. It can be at <body onload="..."> or inside the script tag window.onload=.... You should combine them if more than 1 like:
<body onload="slideit();otherfunction();" ...>
or
window.onload = function(){slideit();otherfunction();}
also, you need to check if there are no conflicting variables from the 2 scripts
davegarrad
03-20-2003, 02:05 PM
how to use two scripts that do use the same variable?
i'm trying to use a "required fields" script with both email and password doublecheck/validation scripts (ie 5 in total) but i'm guessing since both email and passwords are required, i can't use the other scripts. there must be a way...or possibly an easier way (for example a single script that includes all 5 in the one?)
everyone seems to do it but i just can't figure it out...maybe i'm just too tired lol
any help would be greatly appreciated, thanks. and yes i'm just another n00b programmer lol. we all were once.......right? :(
(btw, i'm not trying to use all 5 straight from scratch; i have the required one first, and have tried using the others with it one at a time but none work, possibly because of variable clashes? the required field script works, just none of the others will work with it. PLUS i have replaced the two seperate "onSubmit" handles with a combined one, as the tutorial suggested..still no go :( )
Roy Sinclair
03-20-2003, 03:27 PM
Originally posted by davegarrad
how to use two scripts that do use the same variable?
Edit one of the scripts and change the name of the conflicting variable it uses so there's no longer a conflict between the two scripts.
Grim Santo
03-21-2003, 12:38 AM
I tried changing the image fade Javascript name but after that it didnt work at all.
davegarrad
03-21-2003, 01:00 AM
there's not actually a conflicting variable as such, named in both scripts though:
<script>
/*
Check required form elements script-
By JavaScript Kit (http://javascriptkit.com)
Over 200+ free scripts here!
*/
function checkrequired(which){
var pass=true
if (document.images){
for (i=0;i<which.length;i++){
var tempobj=which.elements[i]
if (tempobj.name.substring(0,8)=="required"){
if (((tempobj.type=="text"||tempobj.type=="textarea")&&tempobj.value=='')||(tempobj.type.toString().charAt(0)=="s"&&tempobj.selectedIndex==-1)){
pass=false
break
}
}
}
}
if (!pass){
alert("One of the required fields is missing information. Please correct this and try again.")
return false
}
else
return true
}
function validform(signupform) {
if (signupform.requiredpassword.value != signupform.requiredpassword2.value) {
alert("Entered passwords do not match. Please try again.")
signupform.requiredpassword.focus()
signupform.requiredpassword.select()
return false
}
return true
}
</script>
and then for the form:
<form name="signupform" method="post" action="signup1.php" onSubmit="return checkrequired(this);return validform(this)">
it's probably something really simple that i just can't see lol :(
Grim Santo
03-21-2003, 01:09 AM
I am having the same problem. I just can figure out what is wrong with it.. Grrrrrr
glenngv
03-21-2003, 01:17 AM
when you do a return, the succeeding statements will not be executed!
<form name="signupform" method="post" action="signup1.php" onSubmit="return (checkrequired(this) && validform(this))">
davegarrad
03-21-2003, 01:23 AM
thaaaaaaank you, i was actually about to try that lol :P works now :D
Grim Santo
03-21-2003, 01:36 AM
At least someone got his script to work. =). I wish i could get mine to work.
glenngv
03-21-2003, 01:43 AM
have you look into the possibility of this in your 2 scripts?
Originally posted by glenngv
this is a common mistake for integrating 2 scripts that run onload. you need to check that there is only 1 window onload event handler. It can be at <body onload="..."> or inside the script tag window.onload=.... You should combine them if more than 1 like:
<body onload="slideit();otherfunction();" ...>
or
window.onload = function(){slideit();otherfunction();}
also, you need to check if there are no conflicting variables from the 2 scripts
Roy Sinclair
03-21-2003, 03:16 PM
Grim,
We can see one script but your post of the other one was <script language="javascript" src="../../headline.js"> which only tells us that the script is in a different file which we don't have access to.
I suspect glenngv is right about the onload conflict problem since that is the usual failure point for using two scripts that do anything active on the page.
Grim Santo
03-22-2003, 12:14 AM
Here is the other scrpit:
var theight=24; var transtime=1000; borderw=0; var pad_top=4; var pad_top2=6; var pad_left=3; var pad_left2=0; borderd='border-style:solid; border-width:0px; border-color:#000000;'; var text_alignt='left'; var text_alignh='center'; var text_decort='none'; var text_decorh='none'; var fstylet='italic'; var fstyleh='normal'; var fweightt='normal'; var fweighth='bold'; var fontn='Tahoma'; bgcol = '#626262'; bgcolh = '#DD1C00'; txtcol = '#FFFFFF'; txthicol = '#FF8000'; txtcolh = '#000000'; border_color_str='#000000'; var nstheight=0,nst2width=0;
var text = new Array();text[0] = "Welcome To Surreal Gamers.com";text[1] = "Soldier of Fortune II: Double Helix First Look (Xbox)";text[2] = "Jak & Daxter 2 Images (PS2)";text[3] = "New Fear Effect Inferno Images (PS2)";text[4] = "Buffy The Vampire Slayer (Xbox)";text[5] = "Transformers Announced (PS2)";text[6] = "Two Additional Characters In Soul Calibur II (All)";text[7] = "Resident Evil Zero (Gamecube)";text[8] = "New Images of Ninja Gaiden (Xbox)";text[9] = "Xbox Color Controllers (Xbox)";
var header = new Array();header[0] = "";header[1] = "News Update:";header[2] = "News Update:";header[3] = "News Update:";header[4] = "Review:";header[5] = "News Update:";header[6] = "News Update:";header[7] = "Review:";header[8] = "News Update:";header[9] = "News Update:";
var linka = new Array();linka[0] = "";linka[1] = "http://www.surrealgamers.com/news/3-17.htm";linka[2] = "http://www.surrealgamers.com/news/3-17.htm";linka[3] = "http://www.surrealgamers.com/news/3-17.htm";linka[4] = "http://www.surrealgamers.com/reviews/xbox/btvs.htm";linka[5] = "http://www.surrealgamers.com/news/3-17.htm";linka[6] = "http://www.surrealgamers.com/news/3-17.htm";linka[7] = "http://www.surrealgamers.com/reviews/gamecube/residentevil0.htm";linka[8] = "http://www.surrealgamers.com/news/3-17.htm";linka[9] = "http://www.surrealgamers.com/news/3-17.htm";
var targa = new Array();targa[0] = "";targa[1] = "_self";targa[2] = "_self";targa[3] = "_self";targa[4] = "_self";targa[5] = "_self";targa[6] = "_self";targa[7] = "_self";targa[8] = "_self";targa[9] = "_self";
var divtext = new Array(); var divh = new Array(); var objst = new Array(); var objs = new Array(); var objsh = new Array();
var IE4B=false;var NS4B=false;var NS6B=false;var OP5B=false; NS4B=((document.layers)?true:false); IE4B=((document.all)?true:false); NS6B=((document.getElementById)&&(!IE4B))?true:false; uagent = window.navigator.userAgent.toLowerCase();IE5=false;IE4=false;IEold=false;IE5=(uagent.indexOf('msie 5.0') != -1)?true:false;IE4=(uagent.indexOf('msie 4') != -1)?true:false;if(IE5||IE4){IEold=true;} OP5B=(uagent.indexOf('opera') != -1)?true:false; if(OP5B==true){IE4B=false;NS6B=true;} if(NS6B==true){IE4B=false;}
var ns6obj=null; var str2=''; var msgw,msgh; var mc=0; var say=0,onceki=0; msgw=487-90; mc=text.length; onceki=mc-1; strpos='';strvis='';strpadding='',strpadding2='';nsdiv=''; nstheight=theight-borderw-borderw; nst2width=487-borderw-borderw; pad_top=pad_top-borderw; if(pad_top<0){pad_top=0;} pad_top2=pad_top2-borderw; if(pad_top2<0){pad_top2=0;}
if(IE4B){ strpos='position:absolute;'; strvis=''; strpadding='padding-top:'+pad_top+'px;padding-left:'+pad_left+'px;'; strpadding2='padding-top:'+pad_top2+'px;padding-left:'+pad_left2+'px;';}else if(NS6B){ strpos='position:absolute;'; strvis='visibility:hidden;'; strpadding='padding-top:'+pad_top+'px;padding-left:'+pad_left+'px;'; strpadding2='padding-top:'+pad_top2+'px;padding-left:'+pad_left2+'px;';}
divtev1=' onmouseover="mdivmo('; divtev2=')" onmouseout ="restime('; divtev3=')" onclick="butclick('; divtev4=')"';
for(i=0;i<mc;i++) { if(IE4B) { divtext[i]='<div id=d'+i+' onmouseover="mdivmo('+i+')" onmouseout ="restime('+i+')" onclick="butclick('+i+')"'+' style="'+strpos+''+strvis+'background:'+bgcol+'; COLOR: '+txtcol+'; '+strpadding+' left:'+90+'; top:0; width:1600 ;height:'+theight+'; FONT-FAMILY: '+fontn+'; FONT-SIZE: '+10+'pt; font-style: '+fstylet+'; font-weight: '+fweightt+'; margin:0px; TEXT-DECORATION: '+text_decort+'; overflow-y:hidden;text-align:'+text_alignt+';cursor: default;">'; divh[i]='<div id=dh'+i+' style="'+strpos+''+strvis+'background:'+bgcolh+'; COLOR: '+txtcolh+'; '+strpadding2+' left:0; top:0; width:'+90+'; height:'+theight+'; FONT-FAMILY: '+fontn+'; FONT-SIZE: '+9+'pt; font-style: '+fstyleh+'; font-weight: '+fweighth+'; TEXT-DECORATION: '+text_decorh+';margin:0px; overflow:hidden;;text-align:'+text_alignh+';cursor: default;">'; } else if(NS6B) { divtext[i]='<div id=d'+i+' onmouseover="mdivmo('+i+')" onmouseout ="restime('+i+')" onclick="butclick('+i+')"'+' style="'+strpos+''+strvis+'background:'+bgcol+'; COLOR: '+txtcol+'; '+strpadding+' left:'+90+'; top:0; width:1600 ;height:'+nstheight+'; FONT-FAMILY: '+fontn+'; FONT-SIZE: '+10+'pt; font-style: '+fstylet+'; font-weight: '+fweightt+'; TEXT-DECORATION: '+text_decort+';margin:0px; overflow-y:hidden;text-align:'+text_alignt+';cursor: default;">'; divh[i]='<div id=dh'+i+' style="'+strpos+''+strvis+'background:'+bgcolh+'; COLOR: '+txtcolh+'; '+strpadding2+' left:0; top:0; width:'+90+'; height:'+nstheight+'; FONT-FAMILY: '+fontn+'; FONT-SIZE: '+9+'pt; font-style: '+fstyleh+'; font-weight: '+fweighth+'; TEXT-DECORATION: '+text_decorh+';margin:0px;overflow:hidden;text-align:'+text_alignh+';cursor: default;">'; } }
function mdivmo(gnum) { if(IE4B) { if(linka[gnum]!='') { objd=eval('d'+gnum); objd.style.color=txthicol; objd.style.cursor='hand'; window.status=''+linka[gnum]; } } else if(NS6B) { if(linka[gnum]!='') { objs[onceki].style.color=txthicol; objs[onceki].style.cursor='pointer'; window.status=''+linka[gnum]; } }}function restime(gnum2){ if(IE4B) { objd=eval('d'+gnum2); objd.style.color=txtcol; window.status=''; } else if(NS6B) { objs[onceki].style.color=txtcol; window.status=''; }}function butclick(gnum3){ if(targa[gnum3]==''){targa[gnum3]='_self';} if(IE4B) { window.open(''+linka[gnum3],''+targa[gnum3]); } else if(NS6B) { window.open(''+linka[gnum3],''+targa[gnum3]); }}
if(IE4B){} else if(NS6B){ str2=''; for(i=0;i<mc;i++) { str2=str2+'<div id=op'+i+' style="position:absolute;overflow:hidden;'+strvis+' left:0;top:0;width:'+nst2width+'; height:'+nstheight+';'+strvis+borderd+'">'; str2=str2+''+divh[i]+header[i]+'</div>'+divtext[i]+''+text[i]+'</div>'; str2=str2+'</div>'; }} else if(NS4B){}
function dotrans(){ if(IE4B) { if(IEold!=true){spage.filters[0].apply();} spage.innerHTML =''+divh[say]+header[say]+'</div>'+divtext[say]+text[say]+'</div>'; if(IEold!=true){spage.filters[0].play();} setTimeout('dotrans()',1000+transtime); } else if(NS6B) { objsh[say].style.visibility='visible'; objsh[onceki].style.visibility='hidden'; objs[say].style.color=txtcol; objs[say].style.visibility='visible'; objs[onceki].style.visibility='hidden'; objst[say].style.visibility='visible'; objst[onceki].style.visibility='hidden'; onceki=say; setTimeout('dotrans()',1000); } say++; if(say>=mc){say=0;}}
function dofirst() { var i=0; var str=""; for(i=0;i<mc;i++) { str="d"+i; objs[i]=document.getElementById(str); objs[i].style.left=""+90+"px"; objs[i].style.top="0px"; objs[i].style.visibility="hidden"; str="dh"+i; objsh[i]=document.getElementById(str); objsh[i].style.left="0px"; objsh[i].style.top="0px"; objsh[i].style.visibility="hidden"; str="op"+i; objst[i]=document.getElementById(str); objst[i].style.left="0px"; objst[i].style.top="0px"; objst[i].style.visibility="hidden"; } objs[0].style.visibility="visible"; objsh[0].style.visibility="visible"; objst[0].style.visibility="visible"; dotrans(); }
function initte() { if(IE4B) { spage.style.borderStyle="solid"; spage.style.borderWidth=""+borderw+"px"; spage.style.borderColor=border_color_str; spage.innerHTML=""+divh[say]+header[say]+"</div>"+divtext[0]+text[0]+"</div>"; say=1; setTimeout('dotrans()',1000); } else if(NS6B) { say=0; ns6obj=document.getElementById('spage'); ns6obj.innerHTML=str2; setTimeout('dofirst()',500); } }
window.onload=initte;
Grim Santo
03-23-2003, 07:56 AM
How can i affect the code that is in the Javascript applet i am running? I am a bit confused.
glenngv
03-24-2003, 12:16 AM
I was right when I suspected that you had 2 onloads...
you have:
<body onLoad="slideit()">
and
window.onload=initte;
just follow what I said in my first post and see what happens. I didn't check for conflicting variables coz the scripts are very long.
Grim Santo
03-24-2003, 01:38 AM
I got it to work. I had to remove the window.onload=initte from the JS applet and add <body onload="slideit();otherfunction=initte()"> to the body of the page. Thanks a lot for putting me in the right direction.
Much Appreciation,
Grim
glenngv
03-24-2003, 01:46 AM
but why this?
<body onload="slideit();otherfunction=initte()">
my suggestion was
<body onload="slideit();otherfunction()">
where obviously otherfunction() is the name of another function to call onload.
you should only have:
<body onload="slideit();initte()">
I think initte() function does not return a value since you used it earlier as window.onload=initte;
Grim Santo
03-24-2003, 04:37 AM
You are correct. Thanks for the info.
vBulletin® v3.8.2, Copyright ©2000-2012, Jelsoft Enterprises Ltd.