PDA

View Full Version : Javascripts interfering with each other...


marnimatul
March 5th, 2006, 09:07
Briefly, I am putting together a site as a favor for my father-in-law. (probably doing a horrible job of it, but it is working, sort of.)

I have a drop down menu with javascript that was working until I added an automatically scrolling javascript textbox. This textbox was created by someone else so I do not have clue as to how to fix it. I know virtually nothing about javascript. I read a thread posted last October on this board. Someone jokingly said to separate them. I had actually tried that, before finding this site, by including the scrolling text box with that nifty php include command. Didn't work. My drop down menu won't work. If someone would please have mercy on this poor, stupid girl and help it would be so greatly appreciated. I might be stupid to all of this but at least I am smart enough to find people who would know how to fix it, right?

*can't wait to be finished with this website*

Advanced Appreciation--- marnimatul

---drop down menu script----

<script type="text/javascript">

startList = function() {
if (document.all && document.getElementById) {
navRoot = document.getElementById("dmenu");
for (i=0; i < navRoot.childNodes.length; i++) {
node = navRoot.childNodes[i];
if (node.nodeName=="LI") {
node.onmouseover=function() {
this.className+=" over";
}
node.onmouseout=function() {
this.className=this.className.replace(" over", "");
}
}
}
}
}

window.onload=startList;
//-->
</script>

---scrolling textbox script----
<script type="text/javascript"><!--
// Scrollers width here (in pixels)
var scrollerwidth="210px"

// Scrollers height here
var scrollerheight="152px"

// Scrollers speed here (larger is faster 1-10)
var scrollerspeed=1

// Scrollers content goes here! Keep all of the message on the same line!
var scrollercontent='<font face="arial" color="white" size="4">Any church can benefit from the Internet. <br><br>Whether you want to sell online, create an informational web site, or created a new way to reach people, the Internet has an answer.</font>'
var pauseit=1

// Change nothing below!

scrollerspeed=(document.all)? scrollerspeed : Math.max(1, scrollerspeed-1) //slow speed down by 1 for NS
var copyspeed=scrollerspeed
var iedom=document.all||document.getElementById
var actualheight=''
var cross_scroller, ns_scroller
var pausespeed=(pauseit==0)? copyspeed: 0

function populate(){
if (iedom){
cross_scroller=document.getElementById? document.getElementById("iescroller") : document.all.iescroller
cross_scroller.style.top=parseInt(scrollerheight)+ 8+"px"
cross_scroller.innerHTML=scrollercontent
actualheight=cross_scroller.offsetHeight
}
else if (document.layers){
ns_scroller=document.ns_scroller.document.ns_scrol ler2
ns_scroller.top=parseInt(scrollerheight)+8
ns_scroller.document.write(scrollercontent)
ns_scroller.document.close()
actualheight=ns_scroller.document.height
}
lefttime=setInterval("scrollscroller()",20)
}
window.onload=populate

function scrollscroller(){

if (iedom){
if (parseInt(cross_scroller.style.top)>(actualheight*(-1)+8))
cross_scroller.style.top=parseInt(cross_scroller.s tyle.top)-copyspeed+"px"
else
cross_scroller.style.top=parseInt(scrollerheight)+ 8+"px"
}
else if (document.layers){
if (ns_scroller.top>(actualheight*(-1)+8))
ns_scroller.top-=copyspeed
else
ns_scroller.top=parseInt(scrollerheight)+8
}
}

if (iedom||document.layers){
with (document){
if (iedom){
write('<div style="position:relative;width:'+scrollerwidth+';height:' +scrollerheight+';overflow:hidden" onMouseover="copyspeed=pausespeed" onMouseout="copyspeed=scrollerspeed">')
write('<div id="iescroller" style="position:absolute;left:0px;top:0px;width:100%;">')
write('</div></div>')
}
else if (document.layers){
write('<ilayer width='+scrollerwidth+' height='+scrollerheight+' name="ns_scroller">')
write('<layer name="ns_scroller2" width='+scrollerwidth+' height='+scrollerheight+' left=0 top=0 onMouseover="copyspeed=pausespeed" onMouseout="copyspeed=scrollerspeed"></layer>')
write('</ilayer>')
}
}
}
//-->
</script>

the_pm
March 5th, 2006, 15:55
Hello marnimatul, and welcome to IWDN :hi:

When two scripts refuse to play nice together, the first thing I look for is conflicting variables between them. I'll take a look more closely through your scripts shortly, but it would be very helpful to see the page in question. If you can't share a page from the actual site, can you copy/paste the pertinent components into a test page? I'd like to experiment with this myself to come up with an answer.

While I'm at it, I'll give your menu an accessibility check, to make sure it degrades gracefully when JavaScript isn't supported :)

marnimatul
March 5th, 2006, 18:45
http://niki.serialcrusher.net <--this is a temp/test place for the site I am working on, it's "home" is not ready yet.

Your help is greatly appreciated. I am a little embarrassed to show this to people who actually know what they are looking as it may be a horrible mess. I do not think the menu "degrades gracefully" because it would not function in Mozilla, I had to fudge it to make it work.

Thanks again-
marnimatul

the_pm
March 5th, 2006, 18:51
Hey, if people were embarrassed to show their work and ask for help, no one would ever learng anything. Don't ever be afraid to put yourself out there. IWDN is a safe place to do this, I promise :)

Ok, at first glance, everything seems to be working fine in Opera. I'll go investigate other browsers and see if I can find any problems in your code.

the_pm
March 5th, 2006, 19:26
Ok, I looked over everything, opening it all up in three different browsers to try to recreate the problem. It looks like the problem is only occuring in Internet Explorer, and it appears there's some code in there that sniffs for IE and serves up the script differently for it. I'll working on eliminating this to see if it makes a different across browsers.

You'll be happy to know the menu does indeed degrade gracefully. If JS is turned off, the top-level links work just fine. Now, that being said, the default page for each section must contain links that mirror the JavaScript navigation you have in place. Otherwise, a significant portion of your audience will not be able to access any of those pages (maybe 1:10 vistors).

marnimatul
March 5th, 2006, 19:36
the default page for each section must contain links that mirror the JavaScript navigation you have in place.

Do you mean that each page should contain the same menu/code? If that is the case then yes, they do because I used it as a php include in my 'template' for every page that I created.

Can't wait to hear the rest of your findings!

the_pm
March 5th, 2006, 19:52
Well thus far, I've not located the elements causing interference. I'm working on it though.

Do you mean that each page should contain the same menu/code? If that is the case then yes, they do because I used it as a php include in my 'template' for every page that I created.The best way to describe what I mean is to disable JavaScript and try surfing your site. Notice that a few of the links across the top are still functional and the rest should be made functional as well). This is a good thing. It means someone browsing with JavaScript disabled or not available will still be able to enter those sections of the site.

But try doing into one of the subpages within a section with JS disabled. You can't, because there is no backup menu in place to allow this to happen. At the very least, the pages you can access with JS turned off should each contain a statically inserted menu with all of the links within that section. Does this make more sense when you try surfing without JS?

marnimatul
March 5th, 2006, 20:26
Your assumption was correct, it isn't working on the subpages. I can only laugh ('cause it is better than crying) because now I have another problem to fix. But that is okay, I think the best way to learn some of these things is just to dive in. This project is making me feel somewhat like Dr. Frankenstein at this point.

Thank you for your diligence. It is appreciated more than you know.

the_pm
March 5th, 2006, 20:39
I'm happy to help Niki. I have a meeting to attend at the moment. I'll dive in further when we're done :)

the_pm
March 6th, 2006, 02:50
Ugh.

The problem is located here somewhere:
document.all.iescroller
cross_scroller.style.top=parseInt(scrollerheight)+ 8+"px"
cross_scroller.innerHTML=scrollercontent
actualheight=cross_scroller.offsetHeightNow, to figure out precisely what that problem is.

BTW, may I ask how your page markup is being generated? Are you writing it by hand, or are you using a particular piece of software?

marnimatul
March 6th, 2006, 04:08
I am writing it all by hand. But I do write inside a php editor, it colorizes things and numbers the lines, helps me out a bit.

Just to remind you, I didn't write the scroller javascript so I won't be able to help there. I would like to give you an 'out'. You have spent so much time on this and I feel your time is valuable and would completely understand if you wanted to discontinue this little adventure.

Thank you again for all your effort!:)

the_pm
March 6th, 2006, 04:21
Here's a tool that might be of interest to you - http://www.htmlhelp.com/tools/validator/ - it's an HTML validator, and it will help you write cleaner, better markup.

I'd actually like to take a stab at rewriting the scroller script. Let me see what I can do. I've never tried something like this before :)

marnimatul
March 6th, 2006, 04:33
Go for it! That would be awesome. I look at the link you gave.

Thanks again!!!

marnimatul
March 7th, 2006, 03:18
Paul, I know you'll figure out!

I have a few small requests, if at all possible. The ability to resize it or a few size options and if it could go about half the speed of the first one I showed you that would be much easier to read. I noticed on the other script something like onmouseover scrollerspeed=0; it may not have been onmouseover but a similar command.

I also told my FIL that a professional had volunteered to work on it. He is very thrilled.

Can't thank you enough!

the_pm
March 7th, 2006, 14:54
Heh, don't thank me yet! I'm not entirely sure I can make this work ;)

But I'll give it my best. At worst, maybe I can find another scroller elsewhere that won't interfere with your menus.

marnimatul
March 7th, 2006, 17:18
Your effort alone deserves appreciation. I am really enjoying the iwdn community. I have been reading through some of the threads and can see that you guys (the whole iwdn community) have a great thing here.

I am going to continue building the site and will, hopefully, be launching it this weekend. I can always add the scroller later, it will be good marketing. Shows that we are growing and improving. Something to send out in a newsletter, 'ya know.

I have a lot to learn about this stuff. Definetly is not as easy as I was hoping it would be. I know I won't be making a career out of it. But at least I will know enough to help my clients. And now I know who to 'call' when one of my clients needs a website.

My sister and I (mostly her) have been working on this site for a real estate broker www.covenantpropertybrokers.com. But her health is preventing her from working on it at this time. If I need to take it outside the both of us I will certainly be contacting Pixecorp first. It will be a few months before we make that determination. I mostly handle the client and 'translate' what is going on at each stage of the project and she makes it work. I have been helping the RE Broker develop his business towards a franchise concept so there will be a lot of opportunity for work on the site, especially with the vision he has for it.

Done rambling now...

the_pm
March 7th, 2006, 17:35
Thank you for your kind words. Just so you know, Pixecore does not exist. It was a possible name for a partnership, but it was never used.

If you ever think you need to outsource your Web site development work, I highly encourage you to put your design and development needs out to the entire community, and see what types of responses you get. There are dozens/hundreds of independent developers here, all with different strengths, approaches and creative vision. I'm confident you'll find the right partner for your needs.

But, if you decide to continue pursuing design yourself, you have the full support of the community in your endeavors. I promise you that :) Web design is harder than most people believe it to be. But it can be very rewarding when done right. I'm a big fan of near-instant gratification, and I like that I can sit down and a couple hours have something of substance in my hands. It's a lot of fun!

marnimatul
March 7th, 2006, 19:33
:blush: Didn't follow that thread all the way through! :( oh well.

Thank you for the suggestion. I will keep that in mind.

marnimatul
March 20th, 2006, 22:19
Hey Paul! I found a scroller that works! jbnlive.com, check it out! If you want the script posted here, just ask, or I can give the link where I found it.

the_pm
March 20th, 2006, 22:22
Yes, please do! I tried a few different scrollers, but I wasn't pleased with the results. If you have a good resource to share, I'm sure people will appreciate having it handy for their own needs as well.

FYI, you might want to move the CSS near your footer up into your page header, and try applying clear:both to that footer. In Opera, it is overlapping the content area :)

marnimatul
March 20th, 2006, 22:29
http://www.dynamicdrive.com/dynamicindex2/crosstick.htm
This is where I got the scroller that WORKS!!! The scripting is for both the box and single scrollers shown so make sure to adjust the scripting accordingly or it won't work. There are some notes in the scripting to help you find what needs to be changed.

thanks for the fyi, I will make those changes.