| 

.NET C# Java Javascript Exception

2
Ich arbeite momentan an einer Website die Media-Queries verwendet. Bei der mobilen Version der Site wird der Text im content erst angezeigt wenn man auf die h2-Überschrift "klickt" (also mit dem Finger, ihr wisst schon... :D). Damit dies funktioniert, ist das ganze natürlich in jQuery angegeben (mittels .click). Jetzt zum komischen an der ganzen Sache. Das ganze funktioniert erst, wenn man das iPhone kippt (landscape). So ähnlich ist es auch im Browser auf dem PC. Erst nach skalieren (z. B. verschieben des linken Browserrahmens um 1px oder mehr) funktioniert die .click-Funktion.

Ich weiß überhaupt nicht woran das liegen könnte. Is doch total komisch.
News:
05.09.2014
Syber
Syber
3 ● 2
Von der Beschreibung her würde ich darauf tippen, dass der click-Handler innerhalb eines resize-Handlers zugewiesen wird. Aber ohne den Code zu sehen kann ich nur raten.
– phg 06.09.2014
3 Antworten
1
Dein Problem ist, dass mobile/tablet erst mal immer false sind und erst nach einem resize-Event abhängig von der Auflösung richtig gesetzt werden. Das erklärt dann auch das von dir beschriebene Verhalten.

Ich würde folgenden Code verwenden:

$(document).ready(function(){
    var mobile = false;
    var tablet = false;

    var checkResolution = function(){
        mobile = $(window).width() < 599? true : false;
        tablet = $(window).width() < 768? true : false;
    };

    $("section.text_content article h2").click(function(){
        if(mobile){
            $("section.text_content article p").toggle("slow");
        }
    });

    $(window).resize(checkResolution); // resize behandeln
    checkResolution(); // beim Seitenaufbau die Auflösung prüfen
});
09.09.2014
phg
phg
1,6k ● 3
0
Hier der Code

$(document).ready(function(){
    var mobile = false;
    var tablet = false;
    $("section.text_content article h2").click(function(){
        if(mobile){
            $("section.text_content article p").toggle("slow");
        }
    });

    $(window).resize(function(){
        mobile = $(window).width() < 599? true : false;
        tablet = $(window).width() < 768? true : false;
    });
});
09.09.2014
Syber
Syber
3 ● 2
0
Hm ne, funktioniert nicht. Tut sich gar nichts. .click funktioniert jetzt nicht mal mehr nachdem ich das Browserfenster skaliere.

Edit: Sorry, war mein Fehler. Hatte ne Klammer nicht geschlossen. Funktioniert wunderbar. Ich danke dir!
09.09.2014
Syber
Syber
3 ● 2
Editiert 09.09.2014
Syber
Syber
3 ● 2

Stelle deine Javascript-Frage jetzt!