PDA

View Full Version : DD Tabs Menu II



DreamPoet
05-14-2007, 05:15 PM
1) Script Title: DD Tabs Menu II

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex1/ddtabmenu2.htm

3) Describe problem: The script itself seems to be working fine, but the browser (IE) gives an "Error on Page" warning. When I checked to see what the error was, it said that the following line is missing an object:

background-color: #CDDADA;


Here is the entire script with the error portion in red:

<style type="text/css">

.halfmoon{
margin-bottom: 4px;
}

.halfmoon ul{
padding: 3px 9px 2px 5px;
margin-left: 0;
margin-top: 1px;
margin-bottom: 0;
font: bold 14px Verdana;
list-style-type: none;
text-align: left; /*set to left, center, or right to align the menu as desired*/
border-bottom: 1px solid #929492;
}

.halfmoon li{
display: inline;
margin: 0;
}

.halfmoon li a{
text-decoration: none;
padding: 3px 9px 2px 5px;
margin: 0;
margin-right: 0; /*distance between each tab*/
border-left: 1px solid #DDD;
color: black;
font: bold 14px Verdana;
background: #ECEEEC url(tabright.gif) top right no-repeat;
}

.halfmoon li a:visited{
color: black;
}

.halfmoon li a:hover, .halfmoon li a.current{
background-color: #CDDADA;
color: navy;
}

#tabcontentcontainer{
width:95%; /*width of 2nd level content*/
height:1.5em; /*height of 2nd level content. Set to largest's content height to avoid jittering.*/
}

.tabcontent{
display:none;
}

</style>

ddadmin
05-14-2007, 08:40 PM
The line you highlighted is a CSS definition. IE only reports scripting errors. Are you sure that is in fact the error your browser is returning? If so, what version of IE? A link to your problem page might be helpful.

DreamPoet
05-14-2007, 08:56 PM
Thank you for your help.

When I checked the details of the page error it listed line 112 as the problem area. I went to view source in notepad and went to line 112, which is the line I highlighted.

I'm using IE 7. The webpage is http://cindy.dreampoet.net.

Thanks again!

ddadmin
05-15-2007, 09:01 AM
I've checked out your page. The problem is that the HTML for your tabs are missing a lot of things from the default script. What you have:


<div id="ddimagetabs" class="halfmoon"><ul>
<li><a href="/homes3/cindy-index.html">Home</a></li>
<li><a href="/about.htm">About Me</a></li>
<li><a href="/listings.html">Listings</a></li>
<li><a href="http://kcbor.fnismls.com/idx/SearchIDX.aspx?RMLS_SESSION_GUID=&#37;7bec943612-a68d-484e-a548-d48b7338dcb6%7d&MLS=KCBOR&SUBSCRIBER=a8be30bb-b63f-4394-94e1-fcc6f131e5e9&class=1" target="_blank">Search</span></a></li>
<li><a href="/contact.html">Contact Me</a></li>
</ul></div>

What it should look like:


<div id="ddimagetabs" class="halfmoon">
<ul>
<li><a href="http://www.dynamicdrive.com" onMouseover="expandcontent('sc1', this)">Home</a></li>
<li><a href="http://www.dynamicdrive.com/new.htm" onMouseover="expandcontent('sc2', this)">DHTML</a></li>
<li class="selected"><a href="http://www.dynamicdrive.com/style/" onMouseover="expandcontent('sc3', this)">CSS</a></li>
<li><a href="http://www.dynamicdrive.com/forums/">Forums</span></a></li>
<li><a href="http://tools.dynamicdrive.com/imageoptimizer/">Gif Optimizer</a></li>
</ul>
</div>

<DIV id="tabcontentcontainer">

<div id="sc1" class="tabcontent">
Return to the <a href="http://www.dynamicdrive.com">frontpage</a> of Dynamic Drive.
</div>

<div id="sc2" class="tabcontent">
See the new scripts recently added to Dynamic Drive. <a href="http://www.dynamicdrive.com/new.htm">Click here</a>.
</div>

<div id="sc3" class="tabcontent">
Original, practical <a href="http://www.dynamicdrive.com/style/">CSS codes and examples</a> such as CSS menus for your site.
</div>

</DIV>

Please revisit the DD page for instructions on how to define the HTML for the menu.

DreamPoet
05-15-2007, 03:01 PM
I'm npt actually using the sub-content level of the menu. I just went back over the <head> code and found the place to completely hide the sub-content...now I'm not getting an error.

Thanks again for your help.

ddadmin
05-15-2007, 09:07 PM
If you're not using the sub menus feature, you can save yourself a lot of unnecessary code by using just the code for the CSS menu itself: http://www.dynamicdrive.com/style/csslibrary/item/half-moon-tab-menu/

DreamPoet
05-16-2007, 06:49 AM
Thanks. I tried that code on a sample page of the same site, but it's leaving an unwelcome gap between the bottom line of the menu and the top portion of the table row below...where a different color starts.

The DD Tab Menu II is working fine now, and looking the way I want it to look. The site's nowhere near finished yet, but the biggest coding part is done.

If you want to see the difference in the tab menus, go to:
http://cindy.dreampoet.net (the good one)
http://cindy.dreampoet.net/index-sample.html (the not so good one)

Thanks for your time and your help...it's much appreciated.