how to use jquery in asp.net with css

Posted by Shanky11 under jQuery on 6/4/2013 | Points: 10 | Views : 1294 | Status : [Member] | Replies : 0
i m using this css with jquery but when i goes to submenu thre is some pblm juse see this


<style type="text/css">

.menu
{
font-family: verdana, Segoe UI;
background-color:Black;
margin-left:120px;
height:70px;
float:left;
margin-top:-10px;
font-family:Arial;
text-align:center;
letter-spacing:normal;
position:relative;
z-index:500;
/*border-radius: 4px; /*To make the corners rounded in IE*/
/*-moz-border-radius: 4px; /*this is for mozilla*/
/*-webkit-border-radius: 4px; /*chrome and other browsers*/
/*box-shadow: 0 1px 1px #dddddd inset;*/
/*-moz-box-shadow: 0 1px 1px #dddddd inset;*/
/*-webkit-box-shadow: 0 1px 1px #dddddd inset;*/

}
.menu ul{
padding:0px;
margin: 0px;
list-style: none;

}
.menu ul li
{
float:left;
position:relative;
font-size:smaller;
}
.menu ul li a{
color:White;
text-decoration: none;
display: block;
padding:10px 15px;
cursor:default;

}
.menu ul li a:hover
{
color:Gray;
}
.sub_menu
{
margin-left:0px;
margin-right:0px;
margin-top:30px;
position:absolute;
background-color:Gray;
width:202px;
top:38px;
display:none; /*hide the subitems div tag initially*/
font-family:Arial;
text-align:center;
letter-spacing:normal;
/*border-bottom:4px solid #B34C00; just to add a little more good look*/
}
.sub_menu ul li
{
width:200px;
border:1px solid black;

}
.sub_menu ul li a{
color:White;
text-decoration:none;
padding:10px 15px;

}
.sub_menu ul li a:hover
{
position:relative;
color:White;

}
</style>
//---------------------------------------------------jquery
<script type="text/javascript">
$(function () {
$('.menu ul li').hover(
function () {
$('.sub_menu', this).stop(true, true).slideDown(1000); /*slideDown the subitems on mouseover*/
}, function () {
$('.sub_menu', this).stop(true, true).slideUp(1000); /*slideUp the subitems on mouseout*/
});
});
</script>




Responses

(No response found.)

Login to post response