jQuery instruction if pour vérifier la visibilité

Question

Je suis en train d'écrire un script qui va masquer/afficher les div en fonction d'autres éléments de visibilité. L'action doit avoir lieu que lorsque je clique sur un autre élément. Voici ce que j'ai écrit jusqu'à présent:

$('#column-left form').hide();
    $('.show-search').click(function() {
        $('#column-left form').stop(true, true).slideToggle(300);
        if( $('#column-left form').css('display') == 'none' ) {
            $("#offers").show();
        } else {
            $('#offers').hide();
        }
    });

Il cache la div, mais il ne revient pas quand je masquer le formulaire. Sera reconnaissant pour toute aide :)

edit:

Ok, j'ai réussi à obtenir l'effet désiré par écrit ceci:

$('#column-left form').hide();
    $('.show-search').click(function() {
        if ($('#column-left form').is(":hidden")) {
            $('#column-left form').slideToggle(300);
            $('#offers').hide();
        } else {
            $('#column-left form').slideToggle(300);
            $("#offers").show();
        }
    });   

Je ne sais pas si c'est écrit correctement, mais il fonctionne ;) Merci à tous pour l'aide!

Answer 1

Vous pouvez utiliser .is(':visible') pour tester si quelque chose est visible et .is(':hidden') pour tester le contraire:

$('#offers').toggle(!$('#column-left form').is(':visible')); // or:
$('#offers').toggle($('#column-left form').is(':hidden'));

Référence:

• http://api.jquery.com/is/
• http://api.jquery.com/visible-selector/
• http://api.jquery.com/hidden-selector/

Answer 2

Oui, vous pouvez utiliser .is(':visible') en jquery. Mais alors que le code s'exécute dans le navigateur safari .is(':visible') est de ne pas travailler.

Veuillez utiliser le code ci-dessous

if( $(".example").offset().top > 0 )

La ligne ci-dessus va travailler à la fois IE safari aussi.

Answer 3

essayez

if ($('#column-left form:visible').length > 0) { ...

Answer 4

 $('#column-left form').hide();
 $('.show-search').click(function() {
    $('#column-left form').stop(true, true).slideToggle(300); //this will slide but not hide that's why
    $('#column-left form').hide(); 
    if(!($('#column-left form').is(":visible"))) {
        $("#offers").show();
    } else {
        $('#offers').hide();
    }
  });