CODEWITHSUNDEEP
jquery
Christopher Thrower
Christopher Thrower

Reputation: 730

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&trade; unit</span></a>
    </li>
    <li class="dolfin">
        <a href="#"><span>Dolfin&trade; sensor</span></a>
    </li>
    <li class="entalk active">
        <a href="#"><span>EnTalk&trade;</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 different images, each corresponding to the li class.

Upvotes: 0

Views: 1732

Answers (1)

Chandu
Chandu

Reputation: 82923

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');
    }
});

Upvotes: 1

Related Questions