reallyvisible Selektor

Question

Die jquery :visible und :hidden Selektoren sind ein wenig irreführend, sie Elemente auswählen, die den Raum in dem Dokument konsumiert, also etwas mit visibility:hidden ist eingestuft als :visible obwohl es nicht o_O ist

Ich muß in der Lage sein, zu wählen nur Elemente, die :reallyvisible sind, dass ich mit meinen Augen sehen kann zB nicht opacity:0 oder visibility:hidden

Offensichtlich für ein Element visuell sichtbar alle sichtbaren es Vorfahren sein auch sein muss, so gehe ich davon eine rekursive der Baum aussehen würde notwendig sein, .

Ist das einfach zu teuer? Kann jemand einen zuverlässigen effizienten Weg vorschlagen, dies zu erreichen?

Answer 1

Wie sei:

$.expr[':'].reallyVisible = function(node, idx){ 

    while(true){ 

     // should be faster than $(node).css() 
     var css = document.defaultView.getComputedStyle(node, null); 

     if(css.opacity == 0 || css.visibility == 'hidden') 
     return false; 

    node = node.parentNode; 

    if(!node || node === document) 
     break; 
    }   

    return true; 
} 

http://jsfiddle.net/jxEFk/

Answer 2

Versuchen Sie diesen Code:

function isVisible(el){ 
    if (el.css('opacity') != '0' && el.css('visibility') != 'hidden') { 
     return true 
    } 
    return false 
} 

$('myelement').filter(function() { 
    visible = true 

    if (isVisible($(this)) == false) 
     visible = false 

    $(this).parents().each(function(){ 
     if (isVisible($(this)) == false) 
      visible = false 
    }) 

    return visible == true 
}).html("I'm really visible !")