-1
Я пытаюсь получить раскрывающееся меню, чтобы медленно опустить элемент меню верхнего уровня «связаться с нами». наведение работает отлично, выполняется с помощью CSS, но я не могу заставить его двигаться медленнее.Невозможно получить меню для работы
Вот мой код, вторая половина:
<script>
$(document).ready(function(){
var full_path = location.href.split("#")[0];
$("#topnav a").each(function(){
var $this = $(this);
if($this.prop("href").split("#")[0] == full_path) {
$this.addClass("active");
}
});
$("nav ul li").hover(function(){
if ($("> ul", this).length > 500) {
$("> ul", this).show();
}
}, function(){
if ($("> ul", this).length > 500) {
$("> ul", this).hide();
}
});
});
</script>
HTML:
<nav id="topNav">
<div class="container_12">
<ul class="grid_12">
<li class="about-navitem"><a href="about-us.html">about us</a></li>
<li class="espace-navitem"><a href="espaceauto.html">espaceauto</a></li>
<li class="requestdemo-navitem"><a href="request-a-quote.html">request a quote</a></li>
<li class="newsroom-navitem"><a href="newsroom.html">newsroom</a></li>
<li class="contact-navitem"><a href="#">contact us</a>
<ul>
<li><strong><span class="red">Contact us today to request a demo!</span></strong><br />
We'll show you how to<br />
reach millions in just minutes<br /><br />
1000 de La Gauchetiere Street West<br />
24th Floor<br />
Montreal Canada<br />
H3B 4W5<br /><br />
(toll-free) 1-855-568-2835<br />(tel) 1-514-448-7457<br />
<a href="mailto:[email protected]">[email protected]</a></li>
</ul>
</li>
</ul>
</div><!--end nav container_12-->
</nav>
И CSS для всего суб-нав
nav li > ul {
display:none;
}
nav li:hover ul {
position:relative;
z-index: 10;
background-image: none;
display:block;
position: absolute;
padding-left: 20px;
padding-top:20px;
height: 325px;
top:47px;
left:-132px;
width: 300px;
background-color: #f2f2f2;
border: 1px solid #ededed;
-webkit-box-shadow: 5px 5px rgba(210, 210, 210, 1);
-moz-box-shadow: 5px 5px rgba(210, 210, 210, 1);
-o-box-shadow: 5px 5px rgba(210, 210, 210, 1);
-ms-box-shadow: 5px 5px rgba(210, 210, 210, 1);
box-shadow: 5px 5px rgba(210, 210, 210, 1);
behavior: url(../PIE/PIE.htc);
}
nav li:hover li {
background-image: none;
margin:0;
}
nav li:hover li a {
color:#e33232;
font: normal 14px/21px arial, sans-serif;
text-align:left;
padding-top:0px;
text-transform:none;
}
nav li:hover li a:hover {
background: none;
text-decoration:underline;
}