javascript - Change color of the text in navigation bar when hover -


i want text of navigation bar change color when hover. what's wrong codes?

html

<div class="nav">     <ul class="pull-left">         <li><a href="#">ride</a></li>         <li><a href="#">drive</a></li>     </ul>     <ul class="pull-right">         <li><a href="#">find city</a></li>         <li><a href="#">help</a></li>         <li><a href="#">sign in</a></li>     </ul> </div> 

css: css part, im not sure when select 'a' or when select 'li'

.nav {     padding: 14px 10px;     text-transform: uppercase;     font-family: avenir;     font-size: 14px;     font-weight: bold;     color: black;     text-decoration: none; }  .nav li {     display: inline; }  .nav {     padding-top: 30px;     padding-right: 30px; }  .add {     color: maroon;     } 

js

$(document).ready(function() {     $('.nav').hover(function() {         $('a').addclass('add')     }, function() {         $('a').removeclass('add')     }); }); 

thanks lot!

no need javascript, can use css this:

you can try add css style nav> a>hover this:

.nav a:hover {     color: maroon;     } 

https://jsfiddle.net/lv3tv5no/


Comments

Popular posts from this blog

sublimetext3 - what keyboard shortcut is to comment/uncomment for this script tag in sublime -

java - No use of nillable="0" in SOAP Webservice -

ubuntu - Laravel 5.2 quickstart guide gives Not Found Error -