Creative DW Menus Pack Forum


box Creative DW Menus Pack
Creative DW Menu Pack is a suite of Dreamweaver extensions that seamlessly blends the flexibility of DHTML and the Flash look and feel to create beautifully web site menus. The extension comes with over 30 built in skins that can be customized to suit the design (colors, fonts, size) and include a smart resize system that preserves round corners and the gradient fills when you change the menu size.

Find out more about Creative DW Menus Pack

Thread: Drop Down Menus disappear while mousing over

title left
User Details
message
title right
Joaby Parker

post date:
2011-08-18 10:34:11
Please see my drop downs at www.kathykayefoods.com roll over the menus multiple times. as you do this the drop downs will sometimes just dissapear beneath your mouse even while you are still over the drop down. Please advise.
Elena Tepardea [Extend Studio]

post date:
2011-08-19 06:13:08
Hello,

I checked your website and this issue appears because of the distance between the main menu and the submenus. You can control this distance from Creative Drop Down Menus, by going to the Layout options and add a bigger value, like, 5 or 10 in V Submenu Overlap field.
This should work!

Regards,
Elena Tepardea
tina

post date:
2012-03-16 04:00:36
Please help it is driving me crazy. When I mouse over my spry menu half of the text disappears. Like when I put the mouse on home the hover colour appears and then half of home just disappears. Also it seems shaky and I have no shake applied?
Any suggestions? Otherwise I am going to have to dump as I cannot spend days working out what is wrong? I am working in dreamweaver CS5.

Thanks

Tina
Elena Tepardea [Extend Studio]

post date:
2012-03-16 10:28:11
Hello Tina,

It would be great if you could send us a link from this page or an archive with your site by e-mail to support[at]extendstudio.com in order to see what happens there.
Also, please tell me in what browser (and version) are you testing this page.
Thank you!

Regards,
Elena Tepardea
tina

post date:
2012-03-21 03:58:35
Hi Elena,

Could you have a look at the code below for my website. I am pretty happy with the opening page except when the menu reveals there is something in the jquery that is making it jerk.
Could you have a look at it and see what you think is up? It is driving me nuts as I am new to this but so keen to get the hang of it.

Here is the html

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link href="CSS/OpenNR-2.css" rel="stylesheet" type="text/css" media="screen">

<title>Untitled Document</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="http://cloud.github.com/downloads/malsup/cycle/jquery.cycle.all.latest.js"></script>

<script>
$(document).ready(function(){
$('#slideshow').cycle({ timeout:6000
});

fx: 'fade' // choose your transition type, ex: fade, scrollUp, shuffle, etc...
$('#NR-small').hide().fadeIn(3000);

$('#cost-tit').hide().delay(2000).fadeIn(2000).delay(2000).fadeOut(2000);
$('#Nav-Menu').hide().delay(8000).fadeIn(2000);




});

</script>









</head>


<body>


<div id="wrapper">

<div id="slideshow">

<img class="pics" src="IMAGES/beauty and fashion-3.jpg"/>
<img class="pics" src="IMAGES/good landscape xerox NR.jpg"/>
<img class="pics" src="IMAGES/seb couple with dressformNR.jpg"/>

</div>

<div id="NR-small">
<img src="IMAGES/ A -NR BW good 154.jpg"/>
</div>



<div id="cost-tit">
<img src="IMAGES/cost title 1.jpg"/>
</div>
<!--start of menu-->

<div id="Nav-Menu">

<ul>
<li><a href="#">SHOW REELS</a>
<ul>
<li><a href="#">Link Item</a></li>
<li><a href="#">Link Item</a></li>
<li><a href="#">Link Item</a></li>
<li><a href="#">Link Item</a></li>
<li><a href="#">Link Item</a></li>
<li><a href="#">Link Item</a></li>
</ul> <!--End inner UL-->
</li> <!--End main UL-->
</ul> <!--End of unordered list-->







<ul>
<li><a href="#">BIOGRAPHY</a>
<ul>
<li><a href="#">Link Item</a></li>
<li><a href="#">Link Item</a></li>
<li><a href="#">Link Item</a></li>
<li><a href="#">Link Item</a></li>
<li><a href="#">Link Item</a></li>
<li><a href="#">Link Item</a></li>
</ul> <!--End inner UL-->
</li> <!--End main UL-->
</ul> <!--End of unordered list-->



<ul>
<li><a href="#">CV/RESUME</a>
<ul>
<li><a href="#">Link Item</a></li>
<li><a href="#">Link Item</a></li>
<li><a href="#">Link Item</a></li>
<li><a href="#">Link Item</a></li>
<li><a href="#">Link Item</a></li>
<li><a href="#">Link Item</a></li>
</ul> <!--End inner UL-->
</li> <!--End main UL-->
</ul> <!--End of unordered list-->



<ul>
<li><a href="#">PORTFOLIO</a>
<ul>
<li><a href="#">Link Item</a></li>
<li><a href="#">Link Item</a></li>
<li><a href="#">Link Item</a></li>
<li><a href="#">Link Item</a></li>
<li><a href="#">Link Item</a></li>
<li><a href="#">Link Item</a></li>
</ul> <!--End inner UL-->
</li> <!--End main UL-->
</ul> <!--End of unordered list-->




<ul>
<li><a href="#">BLOG</a>
<ul>
<li><a href="#">Link Item</a></li>
<li><a href="#">Link Item</a></li>
<li><a href="#">Link Item</a></li>
<li><a href="#">Link Item</a></li>
<li><a href="#">Link Item</a></li>
<li><a href="#">Link Item</a></li>
</ul> <!--End inner UL-->
</li> <!--End main UL-->
</ul> <!--End of unordered list-->



<ul>
<li><a href="#">CONTACT</a>
<ul>
<li><a href="#">Link Item</a></li>
<li><a href="#">Link Item</a></li>
<li><a href="#">Link Item</a></li>
<li><a href="#">Link Item</a></li>
<li><a href="#">Link Item</a></li>
<li><a href="#">Link Item</a></li>
</ul> <!--End inner UL-->
</li> <!--End main UL-->
</ul> <!--End of unordered list-->


</div>





</div>
</body>
</html>


And here is the CSS

@charset "UTF-8";
/* CSS Document */

body { background-color:#000000; }

#wrapper { width:900px; background-color:#000000 ;margin:auto;padding-top:30px;




}

#NR-small {width:184; height:87px; text-align:center; margin-top:35px; }



#cost-tit { text-align:center;margin:29px;}


#slideshow { width:525px; margin-left:auto; margin-right:auto;}

h1 { color:#CC66CC;}






<!--CLASS TAGS-->
.book-pics { margin-too: 50px;}

#Nav-Menu { margin-top:30px;
padding:0px;}

#Nav-Menu ul { margin:0;
padding:0;
line-height:30px;}

#Nav-Menu li { margin:0;
padding:0;
list-style:none;
float:left;
position:relative;
background-color:#000;}

#Nav-Menu ul li a { text-align:center;
font-family:"Times New Roman", Times, serif;
text-decoration:none;
height:30px;
width:150px;
display:block;
color:#FFF;

}

#Nav-Menu ul ul{ position:absolute;
visibility:hidden;
top:30px;

}
#Nav-Menu ul li:hover ul { visibility:visible;}



#Nav-Menu li:hover { background-color:#000;}

#Nav-Menu li:hover ul li a:hover { background-color:#0000;
color:#FF0000; }

#Nav-Menu a:hover { color:#FF0000; }

.clearFloat { clear:both;
margin:0
padding:0}


/*****************end mnu css*********************/

I would be so grateful if you could have a look and suggest how I can correct it!!

Many thanks in advance: Tina
Elena Tepardea [Extend Studio]

post date:
2012-03-21 08:29:06
Hello Tina,

I see that you are not using any of our extensions in this page. unfortunately, as we don't know how this menu works, we cannot tell what is wrong here.
We also have menu solutions, our latest extension is Flexi CSS menus, it works on all major browsers and also on iPad and mobile devices.
http://www.extendstudio.com/product/flexi-css-menus-dreamweaver.html
Here are some samples: http://www.extendstudio.com/flexi-css-menus-dreamweaver/samples.html
You can download it from our website and test it during the 10 days trial.

Regards,
Elena Tepardea