• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 197
  • Last Modified:

Conflicting JavaScripts


I CREATED SOME ROLLOVERS IN IMAGE READY THAT GENERATED A JAVASCRIPT RIGHT AT THE BEGINNING OF THE HTML FILE: .

<!-- ImageReady Preload Script (NewBrightonHeaderSLicedtable.psd) -->
<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) {
            NewBrightonHeaderSLicedtab_04_thrivebutton_over = newImage("images/NewBrightonHeaderSLicedt-06.jpg");
            NewBrightonHeaderSLicedtab_04_contactusbutton_over = newImage("images/NewBrightonHeaderSLicedt-07.jpg");
            NewBrightonHeaderSLicedtab_04_HomeButton_over = newImage("images/NewBrightonHeaderSLicedt-08.jpg");
            NewBrightonHeaderSLicedtab_04_byambutton_over = newImage("images/NewBrightonHeaderSLicedt-09.jpg");
            NewBrightonHeaderSLicedtab_13_HomeButton_over = newImage("images/NewBrightonHeaderSLicedt-19.jpg");
            preloadFlag = true;
      }
}

// -->
</SCRIPT>





I SAVED THE FILE, AND NOW I'M EDITING IT WITH DREAMWEAVER. I ADDED THE FOLLOWING SCRIPT RIGHT WHERE I WANTED IT TO DISPLAY A SCROLLING MARQUEE:




<TD COLSPAN=16><script language="JavaScript1.2" type="text/JavaScript1.2">


/*
Cross browser Marquee script- © Dynamic Drive (www.dynamicdrive.com)
For full source code, 100's more DHTML scripts, and Terms Of Use, visit http://www.dynamicdrive.com
Credit MUST stay intact
*/

//Specify the marquee's width (in pixels)
var marqueewidth="718px"
//Specify the marquee's height
var marqueeheight="34px"
//Specify the marquee's marquee speed (larger is faster 1-10)
var marqueespeed=2
//configure background color:
var marqueebgcolor="#FFCC66"
//Pause marquee onMousever (0=no. 1=yes)?
var pauseit=1

//Specify the marquee's content (don't delete <nobr> tag)
//Keep all content on ONE line, and backslash any single quotations (ie: that\'s great):

var marqueecontent='<nobr><font face="Arial" font color="#660000"><strong><big><b>Healing Hearts.  Building Homes.</font></nobr>'


////NO NEED TO EDIT BELOW THIS LINE////////////
marqueespeed=(document.all)? marqueespeed : Math.max(1, marqueespeed-1) //slow speed down by 1 for NS
var copyspeed=marqueespeed
var pausespeed=(pauseit==0)? copyspeed: 0
var iedom=document.all||document.getElementById
if (iedom)
document.write('<span id="temp" style="visibility:hidden;position:absolute;top:-100px;left:-9000px">'+marqueecontent+'</span>')
var actualwidth=''
var cross_marquee, ns_marquee

function populate(){
if (iedom){
cross_marquee=document.getElementById? document.getElementById("iemarquee") : document.all.iemarquee
cross_marquee.style.left=parseInt(marqueewidth)+8+"px"
cross_marquee.innerHTML=marqueecontent
actualwidth=document.all? temp.offsetWidth : document.getElementById("temp").offsetWidth
}
else if (document.layers){
ns_marquee=document.ns_marquee.document.ns_marquee2
ns_marquee.left=parseInt(marqueewidth)+8
ns_marquee.document.write(marqueecontent)
ns_marquee.document.close()
actualwidth=ns_marquee.document.width
}
lefttime=setInterval("scrollmarquee()",20)
}
window.onload=populate

function scrollmarquee(){
if (iedom){
if (parseInt(cross_marquee.style.left)>(actualwidth*(-1)+8))
cross_marquee.style.left=parseInt(cross_marquee.style.left)-copyspeed+"px"
else
cross_marquee.style.left=parseInt(marqueewidth)+8+"px"

}
else if (document.layers){
if (ns_marquee.left>(actualwidth*(-1)+8))
ns_marquee.left-=copyspeed
else
ns_marquee.left=parseInt(marqueewidth)+8
}
}

if (iedom||document.layers){
with (document){
document.write('<table border="0" cellspacing="0" cellpadding="0"><td>')
if (iedom){
write('<div style="position:relative;width:'+marqueewidth+';height:'+marqueeheight+';overflow:hidden">')
write('<div style="position:absolute;width:'+marqueewidth+';height:'+marqueeheight+';background-color:'+marqueebgcolor+'" onMouseover="copyspeed=pausespeed" onMouseout="copyspeed=marqueespeed">')
write('<div id="iemarquee" style="position:absolute;left:0px;top:0px"></div>')
write('</div></div>')
}
else if (document.layers){
write('<ilayer width='+marqueewidth+' height='+marqueeheight+' name="ns_marquee" bgColor='+marqueebgcolor+'>')
write('<layer name="ns_marquee2" left=0 top=0 onMouseover="copyspeed=pausespeed" onMouseout="copyspeed=marqueespeed"></layer>')
write('</ilayer>')
}
document.write('</td></table>')
}
}


</script> </TD>

AFTER I ADDED IT THE ROLLOVER SCRIPT IS NOT WORKING. WHY????

THANKS IN ADVANCE
0
JohnRamz
Asked:
JohnRamz
  • 8
  • 3
  • 3
  • +1
1 Solution
 
archrajanCommented:
I wonder what this line does

 document[changeImages.arguments[i]].src = changeImages.arguments[i+1];

shud be

document.images[changeImages.arguments[i]].src = changeImages.arguments[i+1];
0
 
Michel PlungjanIT ExpertCommented:
Nah.. Same thing
0
 
Michel PlungjanIT ExpertCommented:
It is this
window.onload=populate

you have a
<body onLoad="preloadImages()"
and it is overwritten

change
window.onload=populate
to
// window.onload=populate

and change
<body onLoad="preloadImages()"
to
<body onLoad="preloadImages(); populate()"


0
Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

 
archrajanCommented:
That requires 4 pairs of eyes ;)
0
 
Michel PlungjanIT ExpertCommented:
Or just someone who has seen this problem 1000 times ;)
0
 
archrajanCommented:
Michel,

The body onload event over writes the window.onload event?
0
 
Michel PlungjanIT ExpertCommented:
no other way around
He can also add the preload to the populate and remove the body onload
0
 
JohnRamzAuthor Commented:
I know nothing about JavaScript, so forgive my ignorance. I cannot find  the argument "<body onLoad="preloadImages()"  that mplungjan is referring to.

PLease be more basic and specific with me.

Thanks


0
 
Michel PlungjanIT ExpertCommented:
Please paste the complete page.

Michel
0
 
SnowFlakeCommented:
michael,

why do you say that

 document[changeImages.arguments[i]].src = changeImages.arguments[i+1];

is the same as

document.images[changeImages.arguments[i]].src = changeImages.arguments[i+1];

assuming
I would expect the first syntax to fail altogether

if you call on:
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];
          }
     }
}

with arguments arg1 and arg2
it would be document[arg1].src = arg2
which IMHO should end up with a "document[arg1] is null or not an object"
while document.images[arg1].src = arg2

will work as long as you have an image named arg1


or does document[str] refer to a variable named str
so because JohnRamz assigns his images to NewBrightonHeaderSLicedtab_04_contactusbutton_over etc.
it is still working using the first syntax ?



0
 
Michel PlungjanIT ExpertCommented:
doument.images["image1"].src
is the same as
document["image1"].src
because
document.image1.src
is the same as
doument.images["image1"].src

Like
document.forms[0].elements["field1"]
is the same as
document.forms[0].field1
and the same as
document.forms[0]["field1"]
0
 
SnowFlakeCommented:
althought they are similar,
document.image1.src requres that the image tag will have an ID
while doument.images["image1"].src requres that the image tag will have a name

right ?

think of the following:
what would happen in wird cases such as having an image whos id and name are "location"

wouldn't document.location.src refer to an expando propery of the location object
while document.images["location"].src will still refer to ths src of the image ?

I think we will both agree the document.getElementById("image1").src is the right way
and I belive that using the images collection is second best.


0
 
Michel PlungjanIT ExpertCommented:
Hehe.
Not right and no we do not agree.

try changing the name to xLocation and see it will be document.location

<img name="location" src="http://www.experts-exchange.com/images/vipAccess.gif">
<a href="#"
onClick="
alert('document.location:['+document.location+']\n'+
'document.location.src:['+document.location.src+']\n'+
'document.location.href:['+document.location.href+']')
">Test</a>

This is the reason not to have a button called "submit"

I will use the document.forms and document.images until they are deprecated.
0
 
SnowFlakeCommented:
JohnRamz - please note that michel has the answer for you above (window.onload gets overwriten)

michel,
hmm...

so the Element named location hides the location property of the document.
Not what I expected but it does make some sense.

but in the scenario above we wanted to make sure we are getting to the image ELEMENT
why would you not agree that document.getElementById("image1").src is the best way
as it inherently states that you are looking for an ELEMENT ?

what would be the drawbacks of using getElementById ?

I see no reason for images and forms to become deprecated however I do see the logic
if fixing the scenario from your example above as it seems as it allows a page to "fake" its origin to some
level.
The reasonable fix would be to make is so that document.location allways returns the location on the document
and document.images["location"] / document.getElementById("location") will return the location IMG element.

so i would prefer not to use document.id to get to an element.

I would love to hear more of your thoughts on this.
0
 
Michel PlungjanIT ExpertCommented:
Perhaps we should discuss this outside this question?
http://www.experts-exchange.com/Community_Support/Expert_Input/Q_21395628.html
0
 
JohnRamzAuthor Commented:
mplungjan,

Thanks for your help, I changed what you said and it worked as a charm.

Keep up the good work!!

JohnRamz
0

Featured Post

Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

  • 8
  • 3
  • 3
  • +1
Tackle projects and never again get stuck behind a technical roadblock.
Join Now