HTML and CSS

How to set up include file for navbar

Please support our HTML and CSS advertiser: PostgreSQL or MySQL? Compare and contrast the two most popular open source databases

•

Join Date: Dec 2004

Posts: 2

Reputation: vcombs is an unknown quantity at this point

Solved Threads: 0

vcombs

Offline

Newbie Poster

How to set up include file for navbar

Oct 21st, 2005

I have a set of pages on my site that I want to connect with a tabbed navbar so that as each tab is clicked, the page reloads with the appropriate data. I also want the button clicked to be properly highlighted to show which page it currently selected.

I have a set of buttons with 3 states, regular, over and on. I have set the mouseover, mouseout events to call the gif based on the appropriate state within the <img> tags. I want to write the code to use the "on" state based on the form loaded -- this will require a little bit of coding.

I think I can set all this up BUT -- I really want to put all this in an include file and call it in the appropriate place on each page. What I don't know is how to format the include file. Is it a file with the button img code within the <html></html> tags (only)? All the include files I've used have been code only, no images.

Can someone point me in the right direction? Can this be done?

•

Join Date: Dec 2004

Posts: 1,655

Reputation: tgreer is an unknown quantity at this point

Solved Threads: 35

tgreer

Offline

Made Her Cry

Re: How to set up include file for navbar

Oct 21st, 2005

I assume you already have a server-side method for your inclusion (PHP, or SSI), and that your question is soley "what do I put in the external file": just the HTML code itself should work fine.

If you want an "almost" completely client-side solution, then you can set the contents of your nav element via JavaScript, and include the js with standard syntax:

 Help with Code Tags 
 HTML and CSS Syntax (Toggle Plain Text) 
<script type="text/javascript" src="myNavBar.js"></script>
<script type="text/javascript" src="myNavBar.js"></script>

Place that in the head of your document. The JavaScript file will contain everything except the "script" tags. The code within the JavaScript will "set" the contents of your navbar element.