View Full Version : Chrome CSS Oddities

12-14-2006, 02:56 PM
1) Script Title: Chrome CSS Drop Down Menu 2.1

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

3) Describe problem: Yes yes, I know. Ditch Frontpage 2003 (w/ IE6, on Win2k). Ok. But since I'm not going to, I've got a question. Why is it everytime I preview my page I get "error:cssdropdown is undefined"?

Also, I was curious, like others are, if there can be multiple menus within a chromecssdropdown menu. I love the look, feel, of chrome (well done & tx for making it free to noobs). But find myself running out of room.

thanks all, much appreciate the dd community!

12-14-2006, 10:16 PM
Do you get the same error when actually viewing your page in IE6? Frontpage 2003 basically uses IE underneath (for previewing) if I'm correct.

Well, you can have multiple chrome menus on the same page, though note that only 1 drop down can appear at any given time. So while you may have two menus, moving your mouse over the 2nd means the 1st menu's dropdown will instantly disappear to reveal the dropdown for the 2nd instead. The demo page (http://www.dynamicdrive.com/dynamicindex1/chrome/index.htm) actually shows multiple chrome menus on the same page (themes section).

12-18-2006, 04:01 PM
It was something in my HEAD


12-27-2006, 12:18 AM
I am using the chrome CSS menu for a site I am creating as well and its not working. I got the code copied right and I can't find the problem. It used to work and then it stopped. Even when I take off my pop-up blocker, it still doesn't work. Any suggestions? Here's my code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>::Pleasant News Co.::</title>
<link rel="stylesheet" type="text/css" href="chrometheme/chromestyle.css" />
<link rel="stylesheet" type="text/css" href="fullcss.css" />
<script type="text/javascript" src="chrome.js">

* AnyLink CSS Menu script- &#169; Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code

<div class="style1" id="left">
<p><a href="golf.html" title="New Window" target="_self">Golf Apparel</a></p>
<p><a href="shirtshats.html" title="New Window" target="_self">T-shirts</a></p>
<p><a href="beads.html" title="New Window" target="_self">College Fun</a></p>
<p><a href="pens.html" title="New Window" target="_self">Pens</a></p>
<p><a href="products.html" title="New Window" target="_self">Leather Items</a></p>
<p><a href="products.html" title="New Window" target="_self">Necklaces</a></p>
<p><a href="leatheritems.html" title="New Window" target="_self">Frames</a></p>

<div class="style1" id="right">
<p><a href="shirtshats.html" title="New Window" target="_self">Custom</a></p>
<p><a href="sly.html" title="New Window" target="_self">Sly Water</a></p>
<p><a href="accessories.html" title="New Window" target="_self">Accessories</a></p>
<p><a href="fun.html" title="New Window" target="_self">Fun Time</a></p>
<p><a href="travel.html" title="New Window" target="_self">Travel</a></p>
<p><a href="" title="New Window" target="_self">View Cart</a></p>
<p><a href="" title="New Window" target="_self">More</a></p>

<div id="center">
<p><img src="logo1.jpg" />

<div id="chromemenu" class="chrometheme">
<li><a href="firstdraft.html">Home</a></li>
<li><a href="products.html" rel="dropmenu1">Products</a></li>
<li><a href="" rel="dropmenu2">About</a></li>
<li><a href="" rel="dropmenu3">Shop</a></li>
<li><a href="">Contact</a></li>
<li><a href="" rel="dropmenu4">Specials!</a></li>

<!--1st drop down menu -->
<div id="dropmenu1" class="dropmenudiv">
<a href="shirtshats.html">T-shirts, Polos, Hats</a>
<a href="sweats.html">Sweats</a>
<a href="golf.html">Golf Apparel</a>
<a href="sly.html">Sly Water</a>
<a href="accessories.html">Accessories</a>
<a href="janitorial.html">Janitorial Supplies</a>

<!--2nd drop down menu -->
<div id="dropmenu2" class="dropmenudiv" style="width: 150px;">
<a href="/">The Company</a>
<a href="">The Mission</a>

<!--3rd drop down menu -->
<div id="dropmenu3" class="dropmenudiv" style="width: 150px;">
<a href="/">Shop</a>
<a href="">Shop</a>
<a href="">Shop</a>

<!--4th drop down menu -->
<div id="dropmenu4" class="dropmenudiv" style="width: 150px;">
<a href="/">Sale!</a>
<a href="">What's New</a>
<a href="">Discounts</a>
<script type="text/javascript">



<div id="middle">
<p><img align="middle" src="title.jpg" /></p>
<p>Purchase from our fine selection of Golf Apparel, Custom T's and sweats, and much, much more!</p>
<p><img src="shirt1.jpg" /></p>

12-27-2006, 12:53 AM
Hi Jasmind:
Do you have a URL to the problem page on your site? Make sure the path to chrome.js and the .css files are correct.

12-27-2006, 03:25 AM
here's my URL:

I just copied and pasted the code from DD to Dreamweaver.

12-27-2006, 05:43 AM
The css file is located in the document root of the website above; however, in the source code you point to it in the "chrometheme" directory (which is non-exsitant [spelling?]). Try taking that out and see if that fixes it.

Hope this helps.

12-27-2006, 06:07 AM
Thanks! That help a lot, but it still doesn't have the background and its hiding behind one of my DIVs. Its also vertical and not horizontal. Any other suggestions?

12-27-2006, 11:49 AM
The class attribute values for your main menu div are incorrect:

<div id="chromemenu" class="chrometheme">

Revert them back to the original:

<div class="chromestyle" id="chromemenu">

If you're trying to change themes, this should be done by replacing the default .css file with one of the alt versions, and not editing the HTML code for the menu.

12-27-2006, 05:26 PM
You guys are geniuses!! Its always something small. Thanks so much!:) :) :) :D