Verwenden von jQuery .hide() mit Fading

Ich habe eine Funktion, die divs basierend auf Kontrollkästchen versteckt.Verwenden von jQuery .hide() mit Fading

JS Fiddle of it working here Real site example here

Ich versuche es Animation zu geben, damit die .hide() verblassen in/out, anstatt einfach zu verschwinden.

Versucht, die jQuery Fade-Funktion verwendet wurden, jedoch als Parameter für .hide() aber scheint nicht

$("div").click(function() { 
     $(this).hide("fade", {}, 1000); 
});

Ich habe versucht, dies in meinem Code zu arbeiten (siehe JS Fiddle), wie die folgenden:

if(allSelected.length > 0){ 
      $("div.prodGrid > div:not(" + allSelected + ")").hide("fade", {}, 1000); 
     }

Wohin gehe ich falsch?

Quelle

2013-04-23 Francesca

Wichtig ist hierbei zu beachten ist, dass die 'hide()' Methode überhaupt keine Wirkung Argument nimmt. Lesen Sie [die Dokumentation der Methode] (http://api.jquery.com/hide/), um die verschiedenen Argumente zu sehen. In solchen Methoden ist das erste Argument oder die erste Argumenteigenschaft normalerweise das Argument 'duration'. – Boaz

$("div").click(function() { 
    $(this).fadeOut(1000); 
})

Es gibt auch fadeIn und fadeToggle.

Quelle

2013-04-23 08:54:37

Dieser Daumen hoch war für jquery – tObi

Dies technisch nicht beantwortet die Frage, da zeigen und verbergen Arbeiten auf dem Display und die Fade-Methoden arbeiten auf Opazität. – neil1967

Sie @ Arnelle-Lösung nutzen können, wenn Sie

Fadeout oder

wollen ersetzen $(this).hide("fade", {}, 1000); mit

 $(this).hide("slow");//or $(this).hide(1000);

vorbei "langsam" eine nette Animation geben, bevor Ihr div versteckt.

Ihre Geige mit Änderungen Geändert: http://jsfiddle.net/Z9ZVk/8/

Quelle

2013-04-23 08:57:38 codefreak

Arnelles Antwort blendet aus. Animation mit Verstecken und Zeigen ist anders als Ausblenden ... Es ist cooler als Ausblenden und Einblenden – codefreak

Das ist wirklich toll, aber es funktioniert nicht, wenn die Filter kurz nacheinander angeklickt werden, ganz typisch für E-Commerce. Denke, ein einfacher Fade könnte besser funktionieren. Das ist aber toll! – Francesca

Versuchen fadeout mit Dauer statt mit auszublenden verwenden.

if(allSelected.length > 0){ 
     $("div.prodGrid > div:not(" + allSelected + ")").fadeOut(1000); 
    }

Working Fiddle

Quelle

2013-04-23 08:59:12

Ich habe den Code in dem unten stehenden Link versuche, seine Arbeit gut.

Using jQuery .hide() and .show() with fading - Live Demo

$("#btnHideShow").click(function() { 
      if ($("#btnHideShow").val() == "Hide") { 
       $("#imgHideShow").hide(1000); 
       $("#btnHideShow").attr("value", "Show"); 
      } 
      else { 
       $("#imgHideShow").show(1000); 
       $("#btnHideShow").attr("value", "Hide"); 
      } 
     });

Sie auch fadeIn, fadeOut, slideUp und slidedown mit JQuery von thebelow Link finden können.

fadeIn fadeOut and slideUp slideDown Effects Using Jquery

Quelle

2015-04-28 13:59:07

Antwort

Verwandte Themen