PDA

View Full Version : Drop Down Tabs



nipens
12-01-2009, 09:50 PM
Hi,

I would like some help to customize the Drop Down Tabs code available at http://www.dynamicdrive.com/dynamicindex1/droptabmenu.htm

To make the above Drop Down Tabs work on a website or to make changes in the menu list we need to manually enter the details or edit the <div> </div> section in the menu tabs and drop down menu(s), in all the web pages.

I was wondering if we could pull the menu tabs and drop down menu(s) codes from some external file just like

<script type="text/javascript" src="dropdowntabfiles/dropdowntabs.js"><script>

<link rel="stylesheet" type="text/css" ref="dropdowntabfiles/ddcolortabs.css" />

This would really help and thanks for your help in advance.

Regds,
Nipen

ddadmin
12-02-2009, 03:25 AM
Are your web pages set up for any server side technologies such as SSI (ie: .shtml pages) or PHP? If so, the best way to do this is just to save the use the given feature to dynamically include the menu parts as external files, and added to every page that references these external files. In the case of SSI for example, you may end up with something like:


<!--#include virtual="/external.htm"-->

See here for a SSI tutorial (http://www.javascriptkit.com/howto/ssi2.shtml). The same concept applies to PHP, ASP etc.

nipens
12-02-2009, 04:08 PM
Hi DD Admin,

Thanks for your reply and my webpages are in HTML (.html). Please advise.

Regds,
Nipen

ddadmin
12-02-2009, 11:37 PM
If your pages are regular .htm (and not .shtml for example), then your options are very limited unfortunately. The Tab menu includes HTML markup that can't be easily put inside a .js file and included that way, ie:


<div id="bluemenu" class="bluetabs">
<ul>
<li><a href="http://www.dynamicdrive.com">Home</a></li>
<li><a href="http://www.dynamicdrive.com/style/" rel="dropmenu1">CSS</a></li>
<li><a href="http://www.dynamicdrive.com/resources/" rel="dropmenu2">Partners</a></li>
<li><a href="http://tools.dynamicdrive.com">Tools</a></li>
</ul>
</div>

You might try the Ajax Includes script (http://www.dynamicdrive.com/dynamicindex17/ajaxincludes.htm) to include the menu that way, but it has many draw backs over a server side solution, from the menu not being search engine indexable to a slight delay each time before the menu is added to the page.