Webstyle4/Dreamweaver MX NavBar Problem

[ww1aero]

Pete,

This appears in your raw code:

<script webstyle4>document.write('<scr'+'ipt src="xaramenu.js">'+'</scr'+'ipt>');document.write('<scr'+'ipt src="FrankenmouseTeeMenu/payment_types.js">'+'</scr'+'ipt>');/*img src="FrankenmouseTeeMenu/Payment_Types.gif" moduleid="Frankenmouse3color (Project)\Payment_Types_off.xws"*/</script>

The 'src' URLs are highlighted in red, and I was going to suggest that you insert a full URL here, but I don't think this matters in the least. The 'img' and 'xws' references have been commented out, as you'd expect but, as Bill has said, there is no indication of the 'menu' graphic, which must exist for it to be displayed. I assume the menu graphic is "Payment_Types.gif"?

I think it is "back to the drawing board" time!

The "FrankenmouseTeeMenu" is the folder the Nav Bar gifs and links are in.

Right, the menu graphics are "Payment_Types.gif"

One thing I noticed though, when you brought this to my attention. While trying to solve another problem I had, unable to upload to remote site from Dreamweaver (turned out I had made an error in defining the remote site), I went back and got rid of all the upper case letters and unneeded spaces. I made sure I changed it in all files used on the local site. But now I notice the uppercase letters still appear in the raw code you copied. Does Dreamweaver puts in it's own uppercase letters into raw code when needed? If not, then some uppercase letters remain even after I changed the files.

Should I go into the raw code and change the upper to lower case to match my current files? (after making a copy of it just in case)

There is mention of the menu graphic in the separate "payment_types.js" file and mention of "mouse over behaviors" in the "xaramenu.js" file.


ALSO, this is in the code of my home page (from local site), from the position of my nav bar; I see this on my remote site too.

<div id="NavBarLowPipe" style="position:absolute; width:702px; height:187px; z-index:16; left: 160px; top: 370px; background-image: url(eeltankbanner/homemicetoppermiddlebottom.jpg); layer-background-image: url(eeltankbanner/homemicetoppermiddlebottom.jpg); border: 1px none #000000;">
<script webstyle4>document.write('<scr'+'ipt src="xaramenu.js">'+'</scr'+'ipt>');document.write('<scr'+'ipt src="FrankenmouseTeeMenu/payment_types.js">'+'</scr'+'ipt>');/*img src="FrankenmouseTeeMenu/Payment_Types.gif" moduleid="Frankenmouse3color (Project)\Payment_Types_off.xws"*/</script>
</div>

I thought this was the code that would allow an association with the "payment_types.js" (gif files) and the "xaramenu.js" files.


Thanks.................................Pete

........................Pete

[Fletch]

ALSO, this is in the code of my home page (from local site), from the position of my nav bar;

<div id="NavBarLowPipe" style="position:absolute; width:702px; height:187px; z-index:16; left: 160px; top: 370px; background-image: url(eeltankbanner/homemicetoppermiddlebottom.jpg); layer-background-image: url(eeltankbanner/homemicetoppermiddlebottom.jpg); border: 1px none #000000;">
<script webstyle4>document.write('<scr'+'ipt src="xaramenu.js">'+'</scr'+'ipt>');document.write('<scr'+'ipt src="FrankenmouseTeeMenu/payment_types.js">'+'</scr'+'ipt>');/*img src="FrankenmouseTeeMenu/Payment_Types.gif" moduleid="Frankenmouse3color (Project)\Payment_Types_off.xws"*/</script>
</div>

Yup, already noted that, which is why I brought it to your attention in the previous post. Here is an example of one of my own in which I will highlight where the menu graphic goes, and where I think your NavBar menu graphic should appear:

<div id="navbar">
<div align="right"><img src="Motif_page4_files/Motif_page4_bar.gif" editor="Webstyle4" moduleid="fhcf-redone (Project)\Motif_page4_bar.xws" class="right"/>
<script webstyle4>document.write('<scr'+'ipt src="xaramenu.js">'+'</scr'+'ipt>');document.write('<scr'+'ipt src="Motif_page4_files/motif_page4_hnavbar.js">'+'</scr'+'ipt>');/*img src="Motif_page4_files/Motif_page4_hnavbar.gif" moduleid="fhcf-redone (Project)\Motif_page4_hnavbar_off.xws"*/</script>
</div>

You'll notice that the two are almost identical layouts (project names different, of course), except that yours is missing the menu graphic. Also, you've used 'absolute' for positioning and a 'z-index' which might be interfering with how the browser is rendering the final page. Worth checking that, especially if it isn't Xara-generated.

It isn't Dreamweaver that is capitalising the names, it is WS4. One of its eccentricities, but from experience it doesn't break anything. It also sets several other parameters that fail W3C validation (e.g. there's no such recognised markup as editor="Webstyle4"), but I eventually delete those when I know the website build is complete.

We'll eat this elephant, one bite at a time ... !

[Soquili]

Hi Pete and Terry (Fletch)

I just got home from work. Sunday is my 16 to 18 hour day

I see you two are getting well into working out the problem.

I'll sit back and learn from both of you if you don't mind.

I don't have much experience with Dreamweaver.

[ww1aero]

Thanks for the help Fletch (and Bill, I can use Dreamweaver, but I sure don't feel comfy with code),

Fletch, I'll try to plug in this modification and see what happens; Black was there already, Red I added.....

<div id="NavBarLowPipe" style="position:absolute; width:702px; height:187px; z-index:16; left: 160px; top: 370px; background-image: url(eeltankbanner/homemicetoppermiddlebottom.jpg); layer-background-image: url(eeltankbanner/homemicetoppermiddlebottom.jpg); border: 1px none #000000;">
<img src="FrankenmouseTeeMenu/Payment_Types.gif" editor="Webstyle4" moduleid="Frankenmouse3color (Project)\Payment_Types.xws">
<script webstyle4>document.write('<scr'+'ipt src="xaramenu.js">'+'</scr'+'ipt>');document.write('<scr'+'ipt src="FrankenmouseTeeMenu/payment_types.js">'+'</scr'+'ipt>');/*img src="FrankenmouseTeeMenu/Payment_Types.gif" moduleid="Frankenmouse3color (Project)\Payment_Types_off.xws"*/</script>
</div>

...........................................Pete

[ww1aero]

I tried the modification, and although it didn't get the bar to show, I am now seeing an "X" (missing file) box in the place the Nav Bar should appear.

www.Frankenmouse.com

At least I can see a change in the correct spot.

But I don't know enough about code to figure out what else I should add or leave out.

I also have a request in for help with Xara, not that I can count on getting the solution from them.

Just so you know what you're looking at in my raw code, this is how my file structure is laid out for my home page on my remote host;

Home/ public_html/ frankenmouseteemenu(My Nav Bar folder), Then files for the Nav Bar gifs, starting with Payment Types.gif, (which is the main underlying nav bar graphic), then various "links.gif"s, mouseover "links.gif"s, a payment_types.js file, then more gifs labled payment types.gif .

Thanks...................................Pete

[Fletch]

Pete,

It is looking for:

http://www.frankenmouse.com/frankenm...ment_types.gif

Make sure that the graphic exists, and that it is in the right directory on your site. That should fix it.

I tried accessing the 'gif' file directly, but I get a 404 error, so it appears that something is 'broken' in the URL (your directory structure on the site might not be the same as the way you're calling it up on your own computer).

Getting closer ... !!



Update: I think I've spotted the problem. This is probably as a result of you editing your filenames locally to change them to lower case and leaving the original 'gifs' in the Xara format with capitalised filenames (or was that the other way round?). Take a closer look.

http://www.frankenmouse.com/frankenm...ment_Types.gif

The script finds the image when it is identified as "Payment_Types.gif", but goes walkabout when it is asked to display "payment_types.gif". I suspect that the rest of the graphics (and code?) you edited are probably affected in the same way. But at least you now know what to do to fix it ... !!

[Soquili]

Pete I did a Whois search for your domain and see that it is hosted on an Apache web server.

Apache is most likely running on a Unix or Linux server which is a case sensitive operating system.

Windows is not case sensitive so Payment_Types.gif and payment_types.gif would be the same on Windows.

On Unix and Linux Payment_Types.gif and payment_types.gif would be two different files.

Not much help but maybe a little background to help isolate the problem.

[ss-kalm]

To be on the safe side with websites generally, don't use any upper case or spaces in filenames or directories.

[Fletch]

Can't agree more, Keith! But tell that to the Xara design crew ... !

---------------------------------------------------------------

Pete,

I guess this is what you're aiming for, but I couldn't produce any 'rollover/mouseover' effects in the Navbar. But the graphic works ...

[ww1aero]

Hey, Thanks A Lot! I really appreciate the help. It's a good thing I saw your posts before I read Xara support's first suggestion. They saw the same problem, but didn't notice it was "upper/lower case" related. They saw that the code was looking for my www.frankenmouse.com URL , and I saw that the real path in my host's file manager starts with Home/public_html/ , so I was going to change those first.

Ironic that I got into trouble trying to get rid of what I THOUGHT would cause trouble (upper case letters), only to CAUSE the kind of problem I was trying to avoid in the first place.

UPDATE: All I had to do was change one folder, "frankenmouseteemenu" to "FrankenmouseTeeMenu"! So much for trying to be careful not to put in any uppercase letters.......geeeesh.........

...............Thanks again for all your help Fletch.........and also Bill and Keith.

................Pete