Home > Web Front-end > HTML Tutorial > Please solve my navigation problem. It's a small problem. Please give me an expert_html/css_WEB-ITnose

Please solve my navigation problem. It's a small problem. Please give me an expert_html/css_WEB-ITnose

WBOY
Release: 2016-06-24 11:44:57
Original
1122 people have browsed it





Document

*{
margin: 0;
padding: 0;
list-style:none;
}
.nav_1{
border-radius: auto;
box-shadow: 10px 10px 5px #888888;
text-align: right;
height: 50px;
margin-top: 50px;
margin-right: auto;
margin-bottom: 50px;
margin-left: auto;
background-color: #930;
}
.nav_1>ul{
display: inline-block;
list-style: none;
position: relative;
width: 960px;
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
margin-left: auto;
text-align: center;
}
.nav_1>ul>li>a{
display: block;
width: 105px;
color: #FFFFFF;
text-align: center;
text-decoration: none;
background-color: #930;
}
.nav_1>ul>li{
line-height: 50px;
display: inline-block;
margin-right: auto;
margin-left: auto;
float: left;
font-family: "新宋体";
font-weight: bold;
}
.nav_1>ul>li>ul{
list-style: none;
display: none;

}
.nav_1>ul>li>ul>li{
display: block;
line-height: 25px;
}
.nav_1>ul>li>ul>li>a{

border-radius:55px;
display: block;
width: 100px;
color: #FFFFFF;
text-align: center;
text-decoration: none;
background-image: url(red flash 11.png);
line-height: 40px;
background-position: center center;
}
.nav_1>ul>li:hover>ul{
display: block;
}

.nav_1 li a:hover{
color: #000;
}
.nav_1 li ul li a:hover{
color: #ff0;
background-color: #000;
}
.nav_1 ul li a.thisclass{
border-radius:55px;
text-decoration: none;
background-color: #CF0;
}


<script> <br> $(function(){ <br> var nav_1 = $(".nav_1 a"); <br> nav_1.click(function(){ <br> $(this).addClass("thisclass").siblings().removeClass("thisclass"); <br> }); <br> }); <br> </script>





  • 主页
             

                 
    • 二级栏目

    •   
               
    • 二级栏目

    •          

      

  • 音乐
             

               
    • 二级栏目


    •          
    • 二级栏目

    •          


  •   
  • 视频
              

    • Second-level column



    • 🎜>                                                                                                      ="#">Secondary column
                                                ">About
                                                                 🎜>                                                                                                                          /ul>







  • My navigation focus clicks on other It will cause other backgrounds to change. The previous one will not disappear. When I need to click on music, the homepage disappears. When I click on a video, the music disappears. How to solve it???? Plan)

    Someone please come! ! !

    $(function(){
    var nav_1 = $(".nav_1 a");
    nav_1.click(function(){
    $(this).closest("ul ").children("li").children("a").removeClass("thisclass");
    $(this).addClass("thisclass");
    });
    }) ;

    source:php.cn
    Statement of this Website
    The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
    Popular Recommendations
    Popular Tutorials
    More>
    Latest Downloads
    More>
    Web Effects
    Website Source Code
    Website Materials
    Front End Template