PDA

View Full Version : JavaScript Conflict



djm
07-28-2005, 11:36 PM
Hey Guys

I am a new member of the dynamic drive forums and I need some help.

The reason for this message is in response to the post below titled 'Mouse cursor and trailing' (I thought id start a new thread although I also posted it as a response below)

I noticed John was very helpful in his response and I was wondering if anyone would be so kind as to help my with a similar dillema that I am having with JavaScript...

Basically I have created a website and I have employed a menu system using javascript (along with other javascripts in the same page.) These all work fine but when I attempt to incorporate a mouse trailer javascript code, it simply does not work as there seems to be a conflict with the other javascript scripts in the webpage, whereas the other scrips work fine.

I tried the links and the tutorial provided by jscheuer1 in the post below but they do not apply to me as I am not using an onLoad script within the body tag of my webpage. (except onLoad=set() to display the date)

My question is in regard to the following quote:

QUOTE

One other approach that works in both situations is to put one script in a borderless iframe. It will look like it is on the same page but, since it really is on a separate page, conflicts are no longer an issue.

UNQUOTE

My question therefore is:

How can I get the javascript coding in the IFRAME of my webpage to work / execute on all other pages? As the javascript seems to be executed in the IFRAME only and not the main page where I want it to work. Bascially the mouse trailer now works in the IFRAME and not the main page of the website so I want to 'pull' in the javascript from this IFRAME into the main pages of the website so that there will no longer be a conflict of scripts as the IFRAME is on a separate page technically.

I thought you guys would be the best to ask this question, as you all seem to know your stuff.

Any answer to this question or help on solving this would greatly be appreciated.

Kind Regards

DJM

Willdawg
07-29-2005, 02:10 AM
bah... I'm gonna become the new jscheuer answering all the stupid questions :P. Well I don't know what the script is but I can answer your question none the less. Just cut-and-paste the code onto your main page since the iFrames content is on another page right. so obviously it would only be executed on that one right so just cut-and-past my good man. And if it now doesn't work in the iframe just copy-and-paste the code into the iFrame. I'm not exactly sure how the script works so I can't give you a definite answer but what I've told you should work.

jscheuer1
07-29-2005, 05:24 AM
I've since updated my advice about using the multiple scripts via an iframe(s). It now is:

One other approach that works in both situations, if adaptable to one (or more) of the scripts, is to put one script in a borderless iframe. It will look like it is on the same page but, since it really is on a separate page, conflicts are no longer an issue.'If adaptable' is the key concept and Willdawg is right, the trailer script will not be active outside the iframe. This approach works well for slideshows, tickers and whatnot, not for document wide effects.

I tried the links and the tutorial provided by jscheuer1 in the post below but they do not apply to me as I am not using an onLoad script within the body tag of my webpage. (except onLoad=set() to display the date)Only takes one in the body tag and then another in a script.

I'm not sure which mouse trailer you are trying to use but, they all (as far as I know) have onload events. These can be for insertion into the the body tag or a part of the script itself. All onloads on a given page must be combined in some fashion in order for them all to work.

djm
07-29-2005, 10:12 AM
Thanks for the response guys

well I have tried the cut and paste method as you say but like I said, there is a javascript conflict thats why I thought of using the javascript in a separate page, IE the IFRAME.

I am using the 'Image Trail Script' from dynamic drive:

http://www.dynamicdrive.com/dynamicindex13/trailer.htm

As far as I know it does not use an onLoad event.

I have tried taking out the date script with the onLoad=set() but the image trailer script still does not work which I think is due to the 'coolmenus' menu system I have employed using extensive javascript coding

Regards

DJM

jscheuer1
07-29-2005, 01:57 PM
From the script:

if (B){
window.onload=getedgesIE
window.onresize=getedgesIE
}If you trace back through the code this basically means that if the browser is IE, use these two events. The 'window.onload' is the same as an onload event in the body tag. Since there are at least three scripts involved in your situation, it is unlikely I can find a solution without a copy of your page with all the scripts on it (working or not) to look at. The best way to do this is to put a demo online somewhere and provide a link to it. You could also post the code or if it is too long to post, attach it, to a message here. If you post code, surround it in
tags in the message so it looks like this:

some code hereand disable smilies in text (see below the full message editor for this and the attachment options).

djm
07-29-2005, 02:14 PM
ok I have attached a txt file containing the code in my first page (apologies for containing the entire code) so i hope this is what you meant?

The image trailer script however is not included in this code for obvious reasons (it does not work)

If you want me to attach the image trailer code too I will attach it to another message

Regards

DJM

jscheuer1
07-29-2005, 04:13 PM
Well, to trouble shoot the trailer script with your code, yes I would need it as it appears on your best attempt. The code you attached presents other problems when trying to debug it.

1 ) Linked scripts for which I have no code.

2 ) Graphics that do not show up.

3 ) Linked external style that I don't have.

Ideally all paths would be absolute and point to existing live files. Do you have a site? If so, the best thing is to upload a demo there and give me the url to it. You can just call it test.htm, it doesn't have to be linked to from any other page on your site and doesn't have to work. It does have to have all the stuff on it and linked to it, available as existing live files.

bubba.daniel
07-29-2005, 04:22 PM
bah... I'm gonna become the new jscheuer answering all the stupid questions :P. Well I don't know what the script is but I can answer your question none the less.

Don't you think that that is kind of rude, when you don't even know. :mad:

djm
07-29-2005, 04:34 PM
In response to jscheuer1, I do not currently have a website online thus I dont think I will be able to do it that way. Il have a think and see what I can do. However the website will be relased online in a couple of weeks so I could leave the image trail script for now and when I put the website online I can provide you with the link so that I can add the script later.

Otherwise I cant think of anything else...except that the linked files do not work etc as they are not provided with the txt file I uploaded but everything works fine when all scripts and images etc are linked at my end.

I appreciate your help and I'l try think of another way or if you know anyer way then just let me know.

Also in response to bubba.daniel- Thanks but I guess Willdawg just didnt understand what I was trying to say regarding my problem in my first post

Cheers

DJM

Willdawg
07-29-2005, 05:49 PM
Man why do you want one of those anyways they're cheesey looking haha.

Twey
07-29-2005, 06:57 PM
Like anything else, depends how it's deployed.

jscheuer1
07-29-2005, 08:18 PM
To djm, the other alternative is to make a .zip file with recursed subdirectories and include only the files needed but don't miss any, be sure to include all the files needed. I can then unzip it to a clean directory and have a look see. Waiting until you are online is fine too.

djm
07-30-2005, 09:35 PM
jscheuer1- Sorry for the delay, I needed a few beers to de-stress! haha

Anyways thanks for the advice, I will get onto making the zip file with all relevant files plus my best attempt at incorporating the image trail script.

Shall I upload the zip file here or to your private email?

Also to Willdawg, good advice, just getting rid of the script, but as cheesy as it sounds, it depends how you use it to make it 'un-cheesy' and besides, it was requested by the client so hey, cant win everything! haha

cheers

DJM

djm
07-31-2005, 06:03 PM
to jscheuer1

im back online now and I have the zip file with the relevant files do I upload it to you here or to your private email?

DJM

jscheuer1
07-31-2005, 08:43 PM
Your choice. If you upload here, others may help as well.

djm
08-01-2005, 12:16 PM
jscheuer1

I have sent the zip file to you, so if you could let me know whether you got it that would be great.

Cheers

DJM

jscheuer1
08-01-2005, 02:41 PM
Got the message, zip file attached and valid, page up and running, trailer not working, yet. I'll get to it later, looks like a semi major project as the most straight forward solution (using an attachEvent for the onload event) did not crack it.

djm
08-01-2005, 03:44 PM
Thats great thanks for your time il be online anytime you need me

cheers

DJM

jscheuer1
08-01-2005, 05:15 PM
I really cannot figure out why exactly but, it has something to do with your doctype. With it 'document.body.clientWidth' is not a number and the usual fix of 'document.documentElement.clientWidth' is zero, clearly incorrect. So, I've substituted the less precise (but workable in your case) 'document.documentElement.offsetWidth'. There also was a conflict with the ticker which I have resolved using 'attachEvent'. Here is a replacement for the script, everything is working now:

<script>

/******************************************
* Cross browser cursor trailer script- By Brian Caputo (bcaputo@icdc.com)
* Visit Dynamic Drive (http://www.dynamicdrive.com/) for full source code
* Modified Dec 30th, 02' by DD. This notice must stay intact for use
******************************************/

A=document.getElementById
B=document.all;
C=document.layers;
T1=new Array("DCS_layout_files/trail_files/drop1.gif",35,35,"DCS_layout_files/trail_files/drop2.gif",30,30,"DCS_layout_files/trail_files/drop3.gif",26,26,"DCS_layout_files/trail_files/drop4.gif",21,21,"DCS_layout_files/trail_files/drop5.gif",16,16,"DCS_layout_files/trail_files/drop6.gif",13,13)

var offsetx=15 //x offset of trail from mouse pointer
var offsety=10 //y offset of trail from mouse pointer

nos=parseInt(T1.length/3)
rate=50
ie5fix1=0;
ie5fix2=0;
rightedge=B? document.documentElement.offsetWidth-T1[1] : window.innerWidth-T1[1]-20
bottomedge=B? document.documentElement.scrollTop+document.documentElement.clientHeight-T1[2] : window.pageYOffset+window.innerHeight-T1[2]

for (i=0;i<nos;i++){
createContainer("CUR"+i,i*10,i*10,i*3+1,i*3+2,"","<img src='"+T1[i*3]+"' width="+T1[(i*3+1)]+" height="+T1[(i*3+2)]+" border=0>")
}

function createContainer(N,Xp,Yp,W,H,At,HT,Op,St){
with (document){
write((!A && !B) ? "<layer id='"+N+"' left="+Xp+" top="+Yp+" width="+W+" height="+H : "<div id='"+N+"'"+" style='position:absolute;left:"+Xp+"; top:"+Yp+"; width:"+W+"; height:"+H+"; ");
if(St){
if (C)
write(" style='");
write(St+";' ")
}
else write((A || B)?"'":"");
write((At)? At+">" : ">");
write((HT) ? HT : "");
if (!Op)
closeContainer(N)
}
}

function closeContainer(){
document.write((A || B)?"</div>":"</layer>")
}

function getXpos(N){
if (A)
return parseInt(document.getElementById(N).style.left)
else if (B)
return parseInt(B[N].style.left)
else
return C[N].left
}

function getYpos(N){
if (A)
return parseInt(document.getElementById(N).style.top)
else if (B)
return parseInt(B[N].style.top)
else
return C[N].top
}

function moveContainer(N,DX,DY){
c=(A)? document.getElementById(N).style : (B)? B[N].style : (C)? C[N] : "";
if (!B){
rightedge=window.innerWidth-T1[1]-20
bottomedge=window.pageYOffset+window.innerHeight-T1[2]
}
c.left=Math.min(rightedge, DX+offsetx);
c.top=Math.min(bottomedge, DY+offsety);
}
function cycle(){
//if (IE5)
if (document.all&&window.print){
ie5fix1=document.documentElement.scrollLeft;
ie5fix2=document.documentElement.scrollTop;
}
for (i=0;i<(nos-1);i++){
moveContainer("CUR"+i,getXpos("CUR"+(i+1)),getYpos("CUR"+(i+1)))
}
}

function newPos(e){
moveContainer("CUR"+(nos-1),(B)?event.clientX+ie5fix1:e.pageX+2,(B)?event.clientY+ie5fix2:e.pageY+2)
}

function getedgesIE(){
rightedge=document.documentElement.offsetWidth-T1[1]
bottomedge=document.documentElement.scrollHeight-T1[2]
}

if (B){

if ( typeof window.attachEvent != "undefined" ) {
window.attachEvent( "onload", getedgesIE );
}
else {
if ( window.onload != null ) {
var oldOnload = window.onload;
window.onload = function ( e ) {
oldOnload( e );
getedgesIE();
};
}
else
window.onload = getedgesIE;
}
//window.onload=getedgesIE
window.onresize=getedgesIE
}

if(document.layers)
document.captureEvents(Event.MOUSEMOVE)
document.onmousemove=newPos
setInterval("cycle()",rate)
</script>

djm
08-01-2005, 07:16 PM
well what can I say? Amazing! I cant tell you how relieved I am, so thanks a lot and I really appreciate your help.

Cheers again

DJM