ankur
ankur

Reputation: 4733

Apply alternate class on li with hidden li present in the list without using :visible

I have list of li which have some hidden li also. I am applying css class by using this method

function ArrangeAlternateRows() {
    $('#' + firstContainer + ' li, #' + secondContainer + ' li').removeClass('AltRow');

    $('#' + firstContainer + ' li:visible:odd').addClass('AltRow');
    $('#' + secondContainer + ' li:visible:odd').addClass('AltRow');
    $('#' + secondContainer + ' li input[type="text"]').css("width", "100%");
}

it works great but in IE-7 ":visible" is not working so i tried to use "not(:hidden)" that also not working.

Is there any alternate to apply css class on li without using ":visible" ?

Upvotes: 0

Views: 330

Answers (3)

Diode
Diode

Reputation: 25165

while making an li visible/invisible add/remove a class, say visible-li

$('#' + firstContainer + ' li').show().toggleClass("visible-li");
$('#' + firstContainer + ' li').hide().toggleClass("visible-li");

So

$('#' + firstContainer + ' li.visible-li')  // gives visible li elements inside firstContainer

Upvotes: 0

VAShhh
VAShhh

Reputation: 3514

You can still use a loop to directly assign a class to li.

If you do that you preserve also the compatibility with other browsers (like IE7)

Check : http://jsfiddle.net/b4zhs/2/

Upvotes: 1

baruch dego
baruch dego

Reputation: 111

.invisibleItem
{
   display:none;
}

Upvotes: 0

Related Questions