javascript - jQuery img.src reset after click -
i have problem navigation.
html
<ul id="menu_bar"> <li><a href="#home" class="hov selected"><img src="img/home_on.png" alt="home" />home</a></li> <li><a href="#portfolio" class="hov"><img src="img/portfolio_off.png" alt="portfolio" />portfolio</a></li> <li><a href="#about" class="hov"><img src="img/about_off.png" alt="about" />about</a></li> <li><a href="#contact" class="hov"><img src="img/contact_off.png" alt="contact" />contact</a></li> </ul> js
$(document).ready(function() { $("img.roll").hover( function() { this.src = this.src.replace("_off", "_over");}, function() { this.src = this.src.replace("_over", "_off");} ); $("a.hov").hover( function() { var img = $(this).find("img")[0]; img.src = img.src.replace("_off", "_over");}, function() { var img = $(this).find("img")[0]; img.src = img.src.replace("_over", "_off");} ); $("a.hov").click( function() { var img = $(this).find("img")[0]; img.src = img.src.replace("_over", "_on"); $("a.hov").removeclass("selected"); $(this).addclass("selected"); } ); }); i want make on click function change anchor class, change img src inside of anchor , when use on anchor reset last clicked anchor normal class , normal img src. function remove class "a.hov", not change img.src "_off" items, , don't know how make it.
$("a.hov").click( function() { $("a.hov").each( //change "_over" "_off" items function() { var img = $(this).find("img")[0]; img.src = img.src.replace("_over", "_off"); }); var img = $(this).find("img")[0]; img.src = img.src.replace("_over", "_on"); //replace "_over" (mabe work without line) img.src = img.src.replace("_off", "_on"); //replace "_off" $("a.hov").removeclass("selected"); $(this).addclass("selected"); } );
Comments
Post a Comment