How can I put the styles properties in one file?

Having problems with DHTML Menu? There is usually somebody here who knows the answer.
Post Reply
heinrichegg
Advanced
Advanced
Posts: 12
Joined: Sat Nov 29, 2003 1:40 am

How can I put the styles properties in one file?

Post by heinrichegg »

I have a site with three different languages and therefore three different menu-files (with alll the same styles).

I would like to have the styles properties only one place so that I don't have to change styles in three different files. Is it possible to put them in a separate file and have a reference to this file in the other menu-files?

Thanks
Heinrichegg
User avatar
John
 Team
 Team
Posts: 5967
Joined: Sun May 19, 2002 8:23 pm
Location: Phoenix, AZ
Contact:

Post by John »

Not being the JS expert around here :roll: I suspect you could put the styles in one file and call it using a JS call the same way the JS files are called now.

Can't hurt to try...
John
User avatar
kevin3442
Milonic God
Milonic God
Posts: 2460
Joined: Sat Sep 07, 2002 12:09 am
Location: Lincoln, NE
Contact:

Post by kevin3442 »

Hi Heinrichegg,

What John is suggesting should work. In other words, remove your global variable settings and styles from menu_data.js and save them in a separate file; maybe call it "menu_styles.js". So menu_styles.js might look something like this:

Code: Select all

_menuCloseDelay=500
_menuOpenDelay=150
_followSpeed=5
_followRate=40
_subOffsetTop=10
_subOffsetLeft=-10
_scrollAmount=3
_scrollDelay=20

with(menuStyle=new mm_style()){
onbgcolor="#4F8EB6";
oncolor="#ffffff";
offbgcolor="#DCE9F0";
offcolor="#515151";
bordercolor="#296488";
borderstyle="solid";
borderwidth=1;
separatorcolor="#2D729D";
separatorsize="1";
padding=5;
fontsize="75%";
fontstyle="normal";
fontfamily="Verdana, Tahoma, Arial";
pagecolor="black";
pagebgcolor="#82B6D7";
headercolor="#000000";
headerbgcolor="#ffffff";
subimage="arrow.gif";
subimagepadding="2";
overfilter="Fade(duration=0.2);Alpha(opacity=90);Shadow(color='#777777', Direction=135, Strength=5)";
outfilter="randomdissolve(duration=0.3)";
}
The above example is taken from the standard horizontal menu sample. Of course, you'd use your own style(s)

Now, menu_data.js (or whatever file names you use) should contain only your menu definitions:

Code: Select all

with(milonic=new menuname("Main Menu")){
style=menuStyle;
etc...;
}
Load the additional menu_styles.js file into your pages before the _data.js file, like so:

Code: Select all

<SCRIPT language=JavaScript src="menu_styles.js" type=text/javascript></SCRIPT>
<SCRIPT language=JavaScript src="menu_data.js" type=text/javascript></SCRIPT>
You have to load the menu_styles.js file before the _data.js file so that the styles are already defined prior to the menu definitions; otherwise, you'll get undefined object errors.

Hope that helps,

Kevin
heinrichegg
Advanced
Advanced
Posts: 12
Joined: Sat Nov 29, 2003 1:40 am

Thanks!

Post by heinrichegg »

Thank you for the help. It works!

I upgraded the old ver. 3.4 to 5 yesterday and everything works without any problems. Even the online converter worked fine.

This version is a lot easier to change menuitems and to edit the menus.

Hovewer:

I use the menu inside a table and it works fine when I use the method described - to put the main menu inside the cell directly in the html-document.

With the old menu I used the PLACEMENU function. This would be a better way of doing it since then you do not need to split the menu between the html-doc and the menu_data.js file.
Look forward to this is fixed.

Best regards
HE
User avatar
John
 Team
 Team
Posts: 5967
Joined: Sun May 19, 2002 8:23 pm
Location: Phoenix, AZ
Contact:

Re: Thanks!

Post by John »

heinrichegg wrote:Thank you for the help. It works!
Glad to hear it!
heinrichegg wrote:I use the menu inside a table and it works fine when I use the method described - to put the main menu inside the cell directly in the html-document.

With the old menu I used the PLACEMENU function. This would be a better way of doing it since then you do not need to split the menu between the html-doc and the menu_data.js file.
Look forward to this is fixed.
I do mine differently than the example, and it seems to work fine...

1. Leave all the JS calls as they are at the top of the <body>.

2. Move only the JS call to your _data.js file to the desired <td>. Nothing else should be in that <td>, and especially no <div> messing around with the table.

3. Keep all your main menu code, etc., together in the JS file as it originally was, not split off in the HTML.

That's it.
John
heinrichegg
Advanced
Advanced
Posts: 12
Joined: Sat Nov 29, 2003 1:40 am

Thanks!

Post by heinrichegg »

It works! Thank you very much!

H
User avatar
John
 Team
 Team
Posts: 5967
Joined: Sun May 19, 2002 8:23 pm
Location: Phoenix, AZ
Contact:

Post by John »

You're welcome.

That'll be 3 bucks, please :!: :D
John
Post Reply