PDA

View Full Version : Problem with combining two scripts together



Irin
12-27-2005, 03:30 AM
Hello,

I have a problem with combining two javascripts together. I'm using Adobe ImageReady rollover effect in my top navigation bar. The code is:

<!-- ImageReady Preload Script -->
<script type="text/javascript">
<!--

function newImage(arg) {
if (document.images) {
rslt = new Image();
rslt.src = arg;
return rslt;
}
}

function changeImages() {
if (document.images && (preloadFlag == true)) {
for (var i=0; i<changeImages.arguments.length; i+=2) {
document[changeImages.arguments[i]].src = changeImages.arguments[i+1];
}
}
}

var preloadFlag = false;
function preloadImages() {
if (document.images) {
Home_over = newImage("Home-over.gif");
About_Us_over = newImage("About-Us-over.gif");
Site_Map_over = newImage("Site-Map-over.gif");
Contact_Us_over = newImage("Contact-Us-over.gif");
preloadFlag = true;
}
}

// -->
</script>
<!-- End Preload Script -->
Now, I want to add "Conveyor Belt slideshow script" from Dynamic Drive. The code I want to use is:

<script type="text/javascript">

/***********************************************
* Conveyor belt slideshow script- Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/


//Specify the slider's width (in pixels)
var sliderwidth="300px"
//Specify the slider's height
var sliderheight="150px"
//Specify the slider's slide speed (larger is faster 1-10)
var slidespeed=3
//configure background color:
slidebgcolor="#EAEAEA"

//Specify the slider's images
var leftrightslide=new Array()
var finalslide=''
leftrightslide[0]='<a href="http://"><img src="dynamicbook1.gif" border=1></a>'
leftrightslide[1]='<a href="http://"><img src="dynamicbook2.gif" border=1></a>'
leftrightslide[2]='<a href="http://"><img src="dynamicbook3.gif" border=1></a>'
leftrightslide[3]='<a href="http://"><img src="dynamicbook4.gif" border=1></a>'
leftrightslide[4]='<a href="http://"><img src="dynamicbook5.gif" border=1></a>'

//Specify gap between each image (use HTML):
var imagegap=" "

//Specify pixels gap between each slideshow rotation (use integer):
var slideshowgap=5


////NO NEED TO EDIT BELOW THIS LINE////////////

var copyspeed=slidespeed
leftrightslide='<nobr>'+leftrightslide.join(imagegap)+'</nobr>'
var iedom=document.all||document.getElementById
if (iedom)
document.write('<span id="temp" style="visibility:hidden;position:absolute;top:-100px;left:-9000px">'+leftrightslide+'</span>')
var actualwidth=''
var cross_slide, ns_slide

function fillup(){
if (iedom){
cross_slide=document.getElementById? document.getElementById("test2") : document.all.test2
cross_slide2=document.getElementById? document.getElementById("test3") : document.all.test3
cross_slide.innerHTML=cross_slide2.innerHTML=leftrightslide
actualwidth=document.all? cross_slide.offsetWidth : document.getElementById("temp").offsetWidth
cross_slide2.style.left=actualwidth+slideshowgap+"px"
}
else if (document.layers){
ns_slide=document.ns_slidemenu.document.ns_slidemenu2
ns_slide2=document.ns_slidemenu.document.ns_slidemenu3
ns_slide.document.write(leftrightslide)
ns_slide.document.close()
actualwidth=ns_slide.document.width
ns_slide2.left=actualwidth+slideshowgap
ns_slide2.document.write(leftrightslide)
ns_slide2.document.close()
}
lefttime=setInterval("slideleft()",30)
}
window.onload=fillup

function slideleft(){
if (iedom){
if (parseInt(cross_slide.style.left)>(actualwidth*(-1)+8))
cross_slide.style.left=parseInt(cross_slide.style.left)-copyspeed+"px"
else
cross_slide.style.left=parseInt(cross_slide2.style.left)+actualwidth+slideshowgap+"px"

if (parseInt(cross_slide2.style.left)>(actualwidth*(-1)+8))
cross_slide2.style.left=parseInt(cross_slide2.style.left)-copyspeed+"px"
else
cross_slide2.style.left=parseInt(cross_slide.style.left)+actualwidth+slideshowgap+"px"

}
else if (document.layers){
if (ns_slide.left>(actualwidth*(-1)+8))
ns_slide.left-=copyspeed
else
ns_slide.left=ns_slide2.left+actualwidth+slideshowgap

if (ns_slide2.left>(actualwidth*(-1)+8))
ns_slide2.left-=copyspeed
else
ns_slide2.left=ns_slide.left+actualwidth+slideshowgap
}
}


if (iedom||document.layers){
with (document){
document.write('<table border="0" cellspacing="0" cellpadding="0"><td>')
if (iedom){
write('<div style="position:relative;width:'+sliderwidth+';height:'+sliderheight+';overflow:hidden">')
write('<div style="position:absolute;width:'+sliderwidth+';height:'+sliderheight+';background-color:'+slidebgcolor+'" onMouseover="copyspeed=0" onMouseout="copyspeed=slidespeed">')
write('<div id="test2" style="position:absolute;left:0px;top:0px"></div>')
write('<div id="test3" style="position:absolute;left:-1000px;top:0px"></div>')
write('</div></div>')
}
else if (document.layers){
write('<ilayer width='+sliderwidth+' height='+sliderheight+' name="ns_slidemenu" bgColor='+slidebgcolor+'>')
write('<layer name="ns_slidemenu2" left=0 top=0 onMouseover="copyspeed=0" onMouseout="copyspeed=slidespeed"></layer>')
write('<layer name="ns_slidemenu3" left=0 top=0 onMouseover="copyspeed=0" onMouseout="copyspeed=slidespeed"></layer>')
write('</ilayer>')
}
document.write('</td></table>')
}
}
</script>

<p align="center"><font face="Arial" size="-2">Free DHTML scripts provided by<br>
<a href="http://dynamicdrive.com">Dynamic Drive</a></font></p>
The problem I have is when I insert this Dynamic Drive script, my Adobe ImageReady rollover effect stops working.

Does anybody can advise me on how I can combine two scripts together. Any help would be greatly appreciated.

Thanks in advance,
Irin.

jscheuer1
12-27-2005, 04:23 AM
What does your body tag look like? Does it have something like this in it? -


<body onload="preloadImages();">

If so, remove the line:


window.onload=fillup

and change the onload event in the body tag to:


<body onload="preloadImages();fillup();">

If this is not what is happening then:

.

Irin
12-27-2005, 04:35 AM
Thanks a lot, John. It's all working now. You awesome.

Thank,
Irin.

Irin
12-28-2005, 03:37 AM
Hi,

Now I got a problem with using a different script with my Adobe ImageReady script. The one I'm trying to integrate requires adding the following code into <head>:

<script LANGUAGE="javascript">

var b_speed=10;
var banner_id=1;
var b_pause=0;
var b_position=0;
function stop(){
if(!b_pause){
clearTimeout(banner_id);
b_pause=1}
else{
banner_main();
b_pause=0}}
function banner_main(){
msg=" This feature adds a scrolling message to your project.";
var k=(150/msg.length)+1;
for(var j=0;j<k;j++)msg+=""+msg;

document.forms[0].substring.value=msg.substring(b_position,b_position+250);
if(b_position++==250){
b_position=0}
banner_id=setTimeout("banner_main()",1000/b_speed)}

</script>
And the following code into <body>:

<form NAME="form" ACTION>
<p>
<input TYPE="text" NAME="substring" SIZE="35"> </p><p> <input TYPE="button" VALUE="Start" ONCLICK="{clearTimeout(banner_id); b_position=0; banner_main()}">
<input TYPE="button" VALUE="Slow" ONCLICK="{if(b_speed&lt;10){alert(&quot;Going Slow!&quot;)}else{b_speed=b_speed-5}}">
<input TYPE="button" VALUE="Fast" ONCLICK="{if(b_speed&gt;25){alert(&quot;Going Fast!&quot;)}else{b_speed=b_speed+5}}">
<input TYPE="button" VALUE="Pause/Reset" ONCLICK="stop()"> </p>
</form>

This script gives me a window for scrolling message to run and buttons Start, Slow, Fast, Pause/Reset underneath it. If I use an Adobe ImageReady rollover effect (the code is above in my first post) in my top navigation bar with this "scrolling message" effect, the "scrolling message" effect doesn't work. When I click Start to launch scrolling message, I'm getting the following Internet Explorer Script Error:

An error has occured in the script on this page.
Line: 173
Char: 1
Error: 'document.forms.0.substring' is null or not an object
Code: 0
URL: ....
Do you want to continue running scripts on this page? Yes/No
Line 173 says: banner_id=setTimeout("banner_main()",1000/b_speed)}

Any help would be greatly appreciated. Thanks in advance,
Irin.

jscheuer1
12-28-2005, 05:29 AM
Are you running a Mac, or some older version of IE, or IE emulation under another browser? That type of yes/no error message went out with IE6. Anyways, it doesn't look like one script is doing anything to the other. However, this looks plain wrong:


document.forms[0].substring.value=msg.substring(b_position,b_position+250);

It should be something like this:


document.forms[0].value=msg.substring(b_position,b_position+250);

At least I would think so, give it a shot.

Irin
12-28-2005, 05:45 AM
Hi John,

I'm running IE6. I tryed replacing

document.forms[0].substring.value=msg.substring(b_position,b_position+250);
with

document.forms[0].value=msg.substring(b_position,b_position+250);
Now, I'm not getting an error message but when I click Start button nothing happens, the scrolling message is not running at all.
There is still something wrong with the script. Any other ideas?

Thanks a lot for your help.

jscheuer1
12-28-2005, 06:03 AM
I put the two scripts (the preload script and the scroller script) on a fresh page for testing. Just copied them from your messages and pasted them into my page, adding:

onload="preloadImages();"

to the body tag. The scroller worked fine, so I am at a loss except that it may be the menu code itself that is the problem or some other error I cannot see from what you have given me.

.

Irin
12-28-2005, 06:32 AM
The url is: h**p://test.tvielectronics.com/Products/TC553-852_Controller.html. This page is for testing purposes only. I'm currently running updates on my web site.

Thanks.

jscheuer1
12-28-2005, 07:08 AM
First of all, go back to the original script, then change forms[0] to forms[1]:


<script LANGUAGE="javascript">

var b_speed=10;
var banner_id=1;
var b_pause=0;
var b_position=0;
function stop(){
if(!b_pause){
clearTimeout(banner_id);
b_pause=1}
else{
banner_main();
b_pause=0}}
function banner_main(){
msg=" This feature adds a scrolling message to your project.";
var k=(150/msg.length)+1;
for(var j=0;j<k;j++)msg+=""+msg;

document.forms[1].substring.value=msg.substring(b_position,b_position+250);
if(b_position++==250){
b_position=0}
banner_id=setTimeout("banner_main()",1000/b_speed)}

</script>

Because there is another form on your page above the scroller's, it is no longer forms[0] (the first form on the page) but forms[1] (the second form on the page.

Irin
12-28-2005, 07:16 AM
You're right again. It was that easy :o :). Everything is working now. Thanks so much.