Autor |
Nachricht |
ladehf
Threadersteller
Dabei seit: 21.02.2016
Ort: München
Alter: -
Geschlecht:
|
Verfasst So 21.02.2016 22:43
Titel Anfänger braucht Hilfe ... Javascript / jQuery |
|
|
Hallo liebe Gemeinde ...
Bin der Michael, 29 Jahre alt und fange gerade an mich mit Javascript und jQuery zu beschäftigen.
Wer kann mir bei meinem Problem helfen ??
Über eine if Abfrage möchte ich die Fenstergröße abfragen und dann je nach Größe die background-color aus meiner CSS Datei ändern. In der CSS habe ich eine #wrapper mit background: #000000;
Jetzt hätte ich gerne bei meinem if Fall die Hintergrundfarbe auf rot, beim else Fall darf sie schwarz bleiben.
<script>
if ($(window).width() < 960) {
}
else {
}
</script>
Für euch bestimmt ein Kinderspiel, ich sitze schon 4 Stunden dran
Ich bedanke mich schon mal !!
VlG MICHAEL
Zuletzt bearbeitet von ladehf am So 21.02.2016 22:43, insgesamt 1-mal bearbeitet
|
|
|
|
|
remote
Dabei seit: 10.11.2006
Ort: /var/www/
Alter: 110
Geschlecht:
|
Verfasst Mo 22.02.2016 01:49
Titel
|
|
|
du hast dich 4 stunden lang mit diesen 4 zeilen beschaeftigt?
lad doch mal deinen aktuellen stand in JSBin oder CodePen hoch.
ansonsten: jQuery addClass und removeClass sollten dich weiterbringen.
|
|
|
|
|
Anzeige
|
|
|
Morgo
Dabei seit: 10.08.2005
Ort: Von Kowelenz bis Kölle
Alter: 39
Geschlecht:
|
Verfasst Mo 22.02.2016 10:40
Titel
|
|
|
Das ist ein Anwendungsfall für Media Queries, nicht für Javascript.
|
|
|
|
|
Equinoxe
Dabei seit: 23.02.2016
Ort: Freiburg
Alter: -
Geschlecht: -
|
Verfasst Di 23.02.2016 12:48
Titel
|
|
|
Ich würde hierfür auch mediaqueries verwenden. Das würde folgendermassen aussehen:
Code: |
#wrapper {
background: #000000;
}
@media screen and (max-width: 960px) {
#wrapper {
background: #ff0000;
}
}
|
|
|
|
|
|
top
Moderator
Dabei seit: 25.11.2003
Ort: Hedwig Holzbein
Alter: 52
Geschlecht:
|
Verfasst Di 23.02.2016 13:16
Titel Re: Anfänger braucht Hilfe ... Javascript / jQuery |
|
|
ladehf hat geschrieben: | ... und fange gerade an mich mit Javascript und jQuery zu beschäftigen.
... |
Für mich hört sich das nach jemanden an, der den Umgang mit jQuery lernen möchte.
Die Hinweise wie man diesen konkreten Fall besser mit Media Queries lösen sollte sind berechtigt, helfen ihm aber nicht dabei JS und jQuery zu lernen.
|
|
|
|
|
Equinoxe
Dabei seit: 23.02.2016
Ort: Freiburg
Alter: -
Geschlecht: -
|
Verfasst Di 23.02.2016 13:33
Titel Berechtigter Einwand |
|
|
OK, der Einwand ist berechtigt.
Die jQuery Lösung würde folgendermassen aussehen:
Code: |
$(window).resize(function() {
if($(this).width() < 960) {
$('#wrapper').css({'background':'#ff0000'});
}
else {
$('#wrapper').css({'background':'#000000'});
}
});
|
Das "$(window).resize()" bewirkt, dass bei jeder Änderung der Fenstergröße die Abfrage wiederholt wird und somit die Farbe im Fall angepasst wird. Damit beim ersten Aufruf das auch ausgeführt wird, muss man den ganzen Code auch noch in "$(document).reday()" aufrufen, also folgendermassen:
Code: |
$(document).ready(function() {
if($(this).width() < 960) {
$('#wrapper').css({'background':'#ff0000'});
}
else {
$('#wrapper').css({'background':'#000000'});
}
});
|
Wenn man es ganz schön machen will, dann kann man das auch in eine Funktion auslagern, was dann zu diesem Code führen würde:
Code: |
function changeColor() {
if($(window).width() < 960) {
$('#wrapper').css({'background':'#ff0000'});
}
else {
$('#wrapper').css({'background':'#000000'});
}
}
$(document).ready(changeColor);
$(window).resize(changeColor);
|
Hoffe, das beantwortet die jQuery Frage
|
|
|
|
|
|
|
|
Ähnliche Themen |
Anfänger braucht Rat zum Homepage-Design
Anfänger braucht kleine Hilfe
CSS Anfänger braucht eure Hilfe..
InDesign CS5: Anfänger braucht Rat bei einer Speisekarte
LiveMotion: Anfänger braucht hilfe bei mouseover
jquery anfänger
|
|