Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.

I try to remove class colorbox when style display:none

il someone can help me, thank you

HTML

    <li class="portfolio-item" style="display: none;">
    <div class="item-image">
        <a class="colorbox cboxElement" href="http://www.monsite.fr/IMG_1423.jpg""></a>
    </div>
</li>
<li class="portfolio-item" style=" ">
    <div class="item-image">
        <a class="colorbox cboxElement" href="http://www.monsite.fr/IMG_1424.jpg""></a>
    </div>
</li>

jQuery

    jQuery(document).ready(function($){
$(".portfolio-item .item-image a[href$='.jpg']").colorbox({
    rel:"group2",
    maxWidth:"80%", 
    maxHeight:"80%"});


    if($('.portfolio-item').css('display') == 'none'){ 
       $('.portfolio-item').find(".item-image a[href$='.jpg']").removeClass('colorbox'); 
    } 

});

Edit

Thanks for your help, but I tried this

jQuery(document).ready(function($){
    $(".portfolio-item .item-image a[href$='.jpg']").colorbox({
       rel:"group2",
    maxWidth:"95%", 
    maxHeight:"95%"});  

    $('li.portfolio-item').filter(':hidden').map(function() {
        $(this).find('a.colorbox').removeClass('colorbox');
    });     
});

But it doesn't work.

share|improve this question
    
Your markup isn't valid, the anchors all have two quotes at the end, making the entire HTML invalid, and selecting anything with jQuery damn near impossible. –  adeneo Jun 14 '13 at 12:34

2 Answers 2

Make sure your href attributes are surrounded by one set of ":

<a class="colorbox cboxElement" href="http://www.monsite.fr/IMG_1423.jpg"></a>


And try using the :hidden pseudo selector to detect if an element has display:none;:

if($('.portfolio-item:hidden').length){ 
   $('.portfolio-item').find(".item-image a[href$='.jpg']").removeClass('colorbox'); 
}


It may be a better approach to use a .each loop on the portfolio items:

$('.portfolio-item:hidden').each(function(){
    $(this).find(".item-image a[href$='.jpg']").removeClass('colorbox');
}

jQuery :hidden

share|improve this answer

First, fix your markup. Then you can do the following:-

$('li.portfolio-item').filter(':hidden').map(function() {
  $(this).find('a.colorbox').removeClass('colorbox');
});
share|improve this answer
    
Thanks for your help... but i tried this –  Hélène Jul 2 '13 at 8:50

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.