Log in

View Full Version : Problem with jQuery Multi Level CSS Menu #1



angie2013
04-26-2013, 11:17 PM
Hello,

hopefully one of you guys is that kind to help me with jQuery Multi Level CSS Menu #1 (http://www.dynamicdrive.com/style/csslibrary/item/jquery_multi_level_css_menu_horizontal_blue/P60/).
You can see my problem at http://www.onlinecart.it/shop/.

I have put the the script into a .tpl file. Everything fine so far, but if you hover over the menu the child menus are to far away to choose from.
The CSS file is the original one (did only some changes to the padding entries and font sizes) and seems not to have any trouble with my shops's css file.

The CSS entries of the .tpl file, where I have put the menu script in:

#barOne {
position:relative;
float:left;
width:930px;
margin:0px 0px 0px 0px;
height:58px;
clear:both;
background-image:url(../styleImages/el-top-bar-bg.gif);
background-repeat:no-repeat;
background-position:0px 28px;
padding:0px 20px 0px 20px;
z-index:100;
background-color:#ffffff;
}
#barOne ul {
position:relative;
float:left;
margin:0px;
padding:0px;
}
#barOne p {
position:relative;
float:left;
clear:both;
margin:0px;
padding:6px 0px 0px 0px;
}
*html #barOne p {
padding:0px;
}

Part in the .tpl file:

<div id="barOne">
<ul id="homeNav">
<li class="{HOMEPAGELI}"><a href="{HOMELINK}" class="{HOMEPAGELINK}">Home</a></li>
{PAGELINKSTOP}
</ul>
{PAGELINKSTOPSUB}
<div id="myjquerymenu" class="jquerycssmenu">
<ul>
<li><a href="#">Accessories</a>
<ul>
<li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=bag">Bags</a></li>
<li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=Jewelry">Jewelry</a>
<ul><li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=Jewelry+Accessories">Accessories</a></li>
<li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=Jewelry+Beads">Beads</a></li>
<li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=Bracelet">Bracelets</a></li>
<li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=Jewelry+Charm">Charms</a></li>
<li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=Jewelry+Collection">Collections</a></li>
<li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=Jewelry+Cufflink">Cufflinks</a></li>
<li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=Earring">Earrings</a></li>
<li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=Necklace">Necklaces</a></li>
<li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=Pendant">Pendants</a></li>
<li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=Jewelry+Ring">Rings</a></li>
<li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=Wedding+Ring">Wedding Rings</a></li>
</ul>
</ul></li>

<li><a href="#">Eyewear</a>
<ul>
<li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=Lenses">Contact Lenses</a></li>
<li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=Prescription+Glasses">Prescription Glasses</a></li>
<li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=Reading+Glasses">Reading Glasses</a></li>
<li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=sunglasses">Sunglasses</a></li>
</ul>
</li>
<li><a href="#">Fashion</a>
<ul>
<li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=Mens+Fashion">Men</a>
<ul><li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=Men+Beanie">Beanies</a></li>
<li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=Men+Boxer">Boxer</a></li>
<li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=Men+Brief">Briefs</a></li>
<li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=Men+Socks">Socks</a></li>
<li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=Men+Tank+Top">Tank Tops</a></li>
<li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=Men+T-Shirt">T-Shirts</a></li>
<li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=Men+Trunk">Trunks</a></li>
</ul>
</li>
<li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=Womens+Fashion">Women</a>
<ul><li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=Blouse">Blouses</a></li>
<li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=Dress">Dresses</a></li>
<li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=sheinside+pant">Pants</a></li>
<li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=Skirt">Skirts</a></li>
<li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=Women+Socks">Socks</a></li>
<li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=sheinside+Suit">Suits</a></li>
<li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=sheinside+Sweater">Sweaters</a></li>
<li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=sheinside+Vest">Vests</a></li>
</ul>
</li>
<li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=unisex">Unisex</a>
</ul></li>
<li><a href="#">Shoes</a>
<ul>
<li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=Mens+Shoe">Men</a></li>
<li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=Womens+Shoe">Women</a></li>
</ul></li>
<li><a href="http://www.onlinecart.it/shop/index.php?case=search&ps=gift">Gifts</a></li>
</ul>
<br style="clear: left" />
</div>
</div>


Doctype is:

<!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">

I don't have any further idea, how to fix this problem :(

Would be great if someone could help me, please.

angie2013
04-27-2013, 05:49 PM
Hellom

didn't fix my problem above, but fixed it in using simple Html Dropdowns, 3 of them in a row.
Works like I wanted it with the CSS Menu.

However...
a big thanks to all the guys, which visited my site to see if they can help :)

Have a nice weekend all

TimothyAllison
05-17-2013, 01:40 PM
Were you able to fix the problem? I am facing same problem so can you help me out? Waiting for quick reply. Thanks in advance

jscheuer1
05-18-2013, 05:13 AM
Were you able to fix the problem? I am facing same problem so can you help me out? Waiting for quick reply. Thanks in advance

He says he did by switching to using "simple drop downs", by which he seems to mean select tags.

If you want more help please start a new thread.