View Full Version : JS does not render CSS

04-11-2009, 03:01 AM
1) Script Title: DDTab menu
2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex1/ddtabmenu.htm

3) Describe problem: Attempted to customise the tab memu.
files uploaded to server,but the CSS does not display the tabs


04-11-2009, 06:46 AM
The paths to the .js and .css files of the script on your page appears to be broken. Make sure they are correct, that is, correctly references the two files on yours server.

04-11-2009, 01:07 PM
All files are in the same directory

Change from relative to absolute urls reflects no change

04-11-2009, 08:01 PM
Hmm that's strange. What happens if you directly add the CSS to the page in the HEAD section of your page:

<style type="text/css">

.basictab ul{
margin: 4px;
padding: 3px 0;
margin-left: 0;
font: bold 12px Verdana;
border-bottom: 1px solid gray;
list-style-type: none;
text-align: left; /*set to left, center, or right to align the menu as desired*/

.basictab li{
display: inline;
margin: 0;

.basictab li a{
text-decoration: none;
padding: 3px 7px;
margin-right: 3px;
border: 1px solid gray;
border-bottom: none;
background-color: #f6ffd5;
color: #2d2b2b;

.basictab li a:visited{
color: #2d2b2b;

.basictab li a:hover, .basictab li a.current{
background-color: #DBFF6C;
color: black;

.basictab li a:active{
color: black;

clear: left;
width:95%; /*width of 2nd level sub menus*/
height:1.5em; /*height of 2nd level sub menus. Set to largest's sub menu's height to avoid jittering.*/



BTW, there's an error in your JavaScript code. The following lines in red should be removed, as you're only showing one menu:

<script type="text/javascript">
//SYNTAX: ddtabmenu.definemenu("tab_menu_id", integer OR "auto")
ddtabmenu.definemenu("ddtabs1", 0) //initialize Tab Menu #1 with 1st tab selected
ddtabmenu.definemenu("ddtabs2", 1) //initialize Tab Menu #2 with 2nd tab selected
ddtabmenu.definemenu("ddtabs3", 1) //initialize Tab Menu #3 with 2nd tab selected
ddtabmenu.definemenu("ddtabs4", 2) //initialize Tab Menu #4 with 3rd tab selected
ddtabmenu.definemenu("ddtabs5", -1) //initialize Tab Menu #5 with NO tabs selected (-1)


04-12-2009, 12:25 AM
With the CSS added to the head section, the style is displayed, however the contents of the 2nd level do not display.
NB since files are in the same directory the script could be called directly
<script type="text/javascript" src="ddtabmenu.js">

04-21-2009, 11:53 AM
The page does not show in IE8

04-21-2009, 12:03 PM
IE doesn't support XHTML, try using a HTML doctype:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

Good luck!

04-22-2009, 01:26 PM
The pages now renders in both FF3 and IE8, but for some unknown reason, the html code appears as invalid and cannot be edited in editor?

Suggestions appreciated

04-22-2009, 01:35 PM
Do you mean it doesn't validate (http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Ffreelinksexchange.net%2Fddtabmenufiles%2Fddtabmenu.html)? Just remove the selfclosing tag here:

<link rel="stylesheet" type="text/css" href= "ddtabmenu.css" />

so it looks like this:

<link rel="stylesheet" type="text/css" href= "ddtabmenu.css">

and then change this:

<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">

to this:

<html lang="en">

Now it should validate.

Good luck!