Modifying DD script - Drop Down Tabs (5 styles)

[Ch3vr0n]

Hy there,

I'm planning on using the Drop Down Tabs (5 styles) script on my site for menu's. Horizontally its working just perfect. However i'm ran into an issue about an hour ago. (style 4)

I also need this menu VERTICALLY. On the demo page it has the 4 tabs home, css codes, partners & tools next to each other. What i'm after is something like this implemented in <table>

<table>
<tr>
<td>
*home
*css codes>
*partners>
*tools>
</td>
</tr>
</table>

mouseover behaviour stays the same.

OR this script modified into 1 tab version that i can call on each time like this (wich i would like better)

<table>
<tr>
<td>
*home
</td>
</tr>
<tr>
<td>
*css codes
</td>
</tr>
</table>

Can anyone help me if you know what i mean ? Its rather important as i cannot find a script with a similar layout & behaviour that pleases me. There are a couple vertical ones on dd but none to my liking.

having the menu appear on another row of horizontal tabs is a no-go for my site layout. I cant completely redesign the layout as a 2nd row of tabs would not only make accessing the 1st tabline more difficult, it would only just be ugly to see.

I have tried giving the <div id> in the "html for menu tabs" a unique id but it just wont work.

I can supply the page source code, but would rather not as i would have to clean out a lot of stuff.

[ddadmin]

Warning: Please include a link to the DD script in question in your post. See this thread for the proper posting format when asking a question.

I'm a little confused. Is your issue that you need to get the menu to work vertically, or is that in addition to the original issue mentioned in your first sentence? It might help to rephrase your question.

[Ch3vr0n]

http://www.dynamicdrive.com/dynamici...roptabmenu.htm

it concerns this script. its the other version of the one u linked

currently i have it working in the default way, that is horizontal. But next to that, i also need it to work vertically (a new menu).

when i create new tabs in the vertical menu. The parent tabs appear, however the childlinks do not. Even though they have been correctly added.

to see it in action : http://www.soliweb.be/home.php

i can provide the source code, or you can just view it from within the browser

[ddadmin]

I see, so you actually need both a horizontal and vertical menu on the same page? It's relatively easy to modify Drop Down Tabs so the sub menus are positioned to the right of the main item (vertical menu), but having both orientations supported is more tricky.

Your best bet IMO is just to use Drop Down Tabs for the horizontal orientation, and for the vertical one, use a generic menu script such as AnyLink CSS Menu, which can apply a drop down menu to any anchor on the link, dropping to its right if desired as well.

[Ch3vr0n]

the submenus in the vertical menu don't HAVE to be dropped down, if they can be shown to the right, thats just as fine.

Using a different menu script isnt really an option, i checked the link you gave me, but i dont really like the looks of it, nor does it really match the other one.

If you can help me modify the vertical menu that options are shown to the right, i would appreciate it very much. Note, the top menu submenus have to stay to be dropped down.

[Ch3vr0n]

bumpetie bump. ddadmin got some idea's ?

[Ch3vr0n]

bump again. Still need that script modified

[ddadmin]

Sorry for the delay. With regards to:

the submenus in the vertical menu don't HAVE to be dropped down, if they can be shown to the right, thats just as fine.

That's what I meant actually, that getting the menu to either drop down or drop to the right depending on the main menu bar's orientation would be tricky. Anyhow, I had some time, so I've added a basic version of this for you. Firstly, use the modified .js file in place of the original. Then, for the menu bar where you wish the drop down menus to drop to the right, insert a rev="lr" attribute inside the menu item(s), ie:

<div id="glowmenu" class="glowingtabs">
<ul>
<li><a href="http://www.dynamicdrive.com" title="Home"><span>Home</span></a></li>
<li><a href="http://www.dynamicdrive.com/style/" title="CSS Library" rel="dropmenu1_d" rev="lr"><span>CSS Codes</span></a></li>
<li><a href="http://www.dynamicdrive.com/resources/" title="Partners" rel="dropmenu2_d" rev="lr"><span>Partners</span></a></li>
<li><a href="http://tools.dynamicdrive.com" title="Webmaster Tools"><span>Tools</span></a></li>
</ul>
</div>
<br style="clear: left;" />
<br class="IEonlybr" />

[Ch3vr0n]

Let me see if i understand you correctly.

With the modified script, the submenues will default to be shown on the right ? Is this correct ?
If i add ' rev="lr" ' the submenues will drop down ? Is this correct aswell ?

The looks of the main tabs & submenues stay the same ?

[ddadmin]

It's the other way around actually. By default the sub menus will still drop down relative to the anchor link, except if the anchor link contains rev="lr" (short of "left right"), which causes that sub menu to drop to the right of the anchor instead.