[GELÖST] jquery - Aktion, unter folgender Bedinung: Browser hat eine Breite von 500 Pixel?

[LikeStar]

Hallo Community,
ich beschäftige mich gerade mit jquery.

Gibt es denn eine Möglichkeit den Code so zu schreiben, dass
die Aktion nur unter einer Bedinung erfolgt? Zum Beispiel:

 jQuery(document).ready(function(){
	jQuery(".button").click(function(){
          jQuery('#mydiv').fadeOut( "slow", "linear");
          unter der Vorrausetzung, dass eine Browser Breite von 500 Pixel festgestellt wird

Der Code soll nur dann funktionieren, wenn die Browserbreite ab 500 Pixel beträgt.
Also ist kleiner als 500 Pixel <
Geht das?

 

[mikdoe]

Ein if drum rum setzen.

 

[j-l-n]

...und die Breite des Browserfensters erhältst du folgendermaßen: jquery - How to get browser width using javascript code? - Stack Overflow

 

[rico2009]

Hier gibt es eine kurze Erklärung zu mikdoes genannter If-Bedingung: SELFHTML: JavaScript / Sprachelemente / Bedingte Anweisungen (if-else/switch)

 

[LikeStar]

Danke erst mal.

Ich dachte das lässt sich wunderbar mit jquery lösen.


Habe Etwas gefunden:

  jQuery(document).ready(function(){
        if (jQuery(window).width() < 500) {
           wenn du Button .btn drückst, soll #mydiv mit .FadeOut verschwinden.
        }  
    });

Wie soll das jetzt gehen??

 

[j-l-n]

Ähm...so?

  jQuery(document).ready(function(){
        if (jQuery(window).width() < 500) {
             jQuery(".button").click(function(){
                jQuery('#mydiv').fadeOut( "slow", "linear");
             });
        }  
    });

PS: für JavaScript bitte

[/I]-Tags statt [I][HTML][/I] verwenden!

 

[LikeStar]

Ähm...so?

Nein. Funktioniert nicht.

Edit: Kann mir auch nicht vorstellen, dass es funktioniert. ;-)

 

[j-l-n]

Funktioniert nicht.

Was heißt das? Bitte gib eine etwas ausführliche Beschreibung und schau mal nach, ob etwas in der Fehlerkonsole steht...

 

[LikeStar]

Was heißt das? Bitte gib eine etwas ausführliche Beschreibung und schau mal nach, ob etwas in der Fehlerkonsole steht...

Testweise habe ich Folgendes Ausprobiert:

   jQuery(document).ready(function(){
        if (jQuery(window).width() < 500) {
            jQuery('body').css('display', 'none');        
        }  
    });

Das funktioniert einwandfrei.

Dein oben genannter Code funktioniert leider nicht.

HTML Gerüst ist validiert und Fehlerfrei.

 

[j-l-n]

Dein oben genannter Code funktioniert leider nicht.

Das ist keine Fehlerbeschreibung - hättest du in die Fehlerkonsole gesehen, hättest du gemerkt, dass oben eine schließende Klammer bei .click() fehlt; habe das oben ausgebessert.

Kann mir auch nicht vorstellen, dass es funktioniert.

Wieso?? Tut es doch...

 

[LikeStar]

Wieso?? Tut es doch...

Jetzt funktioniert's. Die Klammer hast du vergessen.

Delay
Sind .delays grundsätzlich für .css Aktionen nicht anwendbar? Der Befehl (.delay) funktkioniert nicht. Will er einfach nicht machen.

jQuery('#navi').delay(2000).css("cssText", "opacity:0.0!important;");

(window).width()
Funktioniert leider nicht, sobald der Browser live minimiert wird (das Verkleinern des Browser-Fensters).

Nur wenn ich die Seite mit einem Smartphone aufrufe :- )))

Edit: Das Live Minimieren habe ich selbst hingekriegt mit:

var windowsize = $(window).width();
$(window).resize(function() {
  windowsize = $(window).width();
  if (windowsize < 500) {

 

[j-l-n]

Sind .delays grundsätzlich für .css Aktionen nicht anwendbar? Der Befehl (.delay) funktkioniert nicht.

Using jQuery delay() with css() - Stack Overflow