Ногами не пинайте пожалуйста только
, я в jquery новичок, скрипты корявенько пишу. В общем не могу разобраться как правильно сделать плавное появление и затухание подпунктов меню
Само меню выглядит так id="menu" ul li ul li
CSS
#menu{
font-size:16px;
font-family:Arial, "Times New Roman", Times, serif;
padding:0;
margin:0;
margin-top:40px;
width:700px;
height:80px;
float:right;
background:none;
}
#menu ul{
margin:0;
padding:0;
}
#menu li{
float:left;
margin:0;
padding:0;
position:relative;
width:140px;
height:80px;
text-align:center;
list-style:none;
}
#menu ul li a{
opacity:0.6;
}
#menu ul li a:hover,
#menu ul li.active a {
opacity:1.0;
}
#menu ul li ul{
display:block;
padding:0;
margin:0;
margin-top:55px;
position:absolute;
width:190px;
z-index:9999;
overflow:hidden;
}
#menu ul li ul li{
float:none;
height:35px;
width:190px;
margin:0;
text-align:centr;
background:url(../images/Background_link_3.png);
}
#menu li ul li.active a {
color:#36F;
}
#menu li ul li:first-child{
border-radius:5px 5px 0 0;
}
#menu li ul li:last-child{
border-radius:0 0 5px 5px;
}
#menu li a{
display:block;
width:140px;
height:25px;
text-decoration:none;
color:#FFF;
}
#menu li ul li a{
width:190px;
height:25px;
text-decoration:none;
color:#FFF;
opacity:1.0;
padding-top:10px;
}
#menu li:hover ul{
display:block;
}
#menu li ul li:hover{
background:url(../images/Background_link_hover_2.png);
}
#menu ul li a img{
border: none;
}
Ну и скрипт
$(document).ready(function() {
var podMenu = $('#menu ul li ul li');
podMenu.hover(function() {
$(this).fadeIn(3000);
},function() {
$(this).fadeOut(3000);
});
});
И ни чего не происходит
ПОпробовал просто работоспособность самого jquery простой функцией
$(document).ready(function() {
$('img[src*=Logo.png]').hide(3000);
});
И это почему то не работает
Сама библиотека jquery подключена между <head></head>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">
$.noConflict();
</script>
ТАк почему же не работает jquery и правильный ли скрипт?