Change background img IF class="active"
I'm trying to change the background image of a div when I click on a thumbnail. The background needs to change based on what thumbnail is "active"
My code I tried;
$('#sliderThumbs li a').click( function() {
if($('#sliderThumbs li.entalk.active') === true) {
$('#slider').css('background','url(i/slider-bg.jpg) no-repeat 0 -550px');
}
});
The HTML:
<div id="slider">
<ul id="sliderThumbs">
<li class="intellibalast">
<a href="#"><span>Intelliblast™ unit</span></a>
</li>
<li class="dolfin">
<a href="#"><span>Dolfin™ sensor</span></a>
</li>
<li class="entalk active">
<a href="#"><span>EnTalk™</span></a>
</li>
</ul>
So when I click on say.. Intellibalast, that li will then turn to class="intellibalast active"
The background of Will need to change based on what li is active (I have 3 differe开发者_如何学Pythonnt images, each corresponding to the li class.
Update: Used .is instead of hasClass and removed ; from the css value.
Try this:
$('#sliderThumbs li a').click( function() {
if($(this).closest("li").is(".entalk, .active")) {
$('#slider').css('background','url(../i/slider-bg.jpg) no-repeat 0 -550px');
}
});
精彩评论