Bei verschiedenen Bildschirmauflösung andere Linkfarbe verwenden

[stolperstein]

Guten Tag,

ich würde gerne auf meiner Homepage Wallpaper zum Download anbieten.
Ein Wallpaper hat beispielsweise 10 Verschiedene Formate.

Jetzt möchte ich das dem Besucher meiner Website der Link zum Download des Wallpapers in der für ihn passenden Größe in Rot angezeigt wird. Z.B. wie hier: www.opacity.us/extras/

Wie kann ich so etwas realisieren?
Ich schätze mal das das mit Javascript funktioniert. Allerdings habe ich keine Ahnung von Javascript, sondern nur von HTML. Daher bitte ich euch um hilfe.

Mit freundlichen Grüßen,

stolperstein

[JürgenB]

Hallo stolperstein,

das hier dürfte dir weiterhelfen:

http://de.selfhtml.org/javascript/objekte/screen.htm

Gruß, Jürgen

[JürgenB]

Hallo,

http://de.selfhtml.org/javascript/objekte/screen.htm

die Hälfte vergessen, das hier kannst du auch noch gebrauchen:

http://de.selfhtml.org/javascript/objekte/style.htm

Gruß, Jürgen

[Don P]

Hallo,

Zur Bildschirmauflösung und JavaScript siehe http://de.selfhtml.org/javascript/objekte/screen.htm#width@title=screen.width und http://de.selfhtml.org/javascript/objekte/screen.htm#height@title=screen.height sowie das hier.

Gruß, Don P

[stolperstein]

Danke für eure Antworten, aber die geposteten Seiten habe ich auch über Google gefunden, allerdings kriege ich die Codeschnipsel nicht wirklich zusammen gefügt, ich habe:

<script type="text/javascript">
#test1 if {screen.availHeight 1280= screen.height} {screen.availWidth 800= screen.width}
   color:red;
</script>

<p id="test1"><a href="http://www.test.de">Wallpaper 1</a></p>

Jetzt müsste doch die Verlinkung rot dargestellt werden. Tut sie aber nicht :(

[Shadowcrow]

'ǝɯɐu$ ıɥ

<script type="text/javascript">
#test1 if {screen.availHeight 1280= screen.height} {screen.availWidth 800= screen.width}
   color:red;
</script>

<http://de.selfhtml.org/javascript/sprache/operatoren.htm#vergleich@title=ich schenk dir ein =>  ;-) und muss da nicht noch ein ODER zwischen?

<p id="test1"><a href="http://www.test.de">Wallpaper 1</a></p>

Benutze bitte die dafür Reservierten Domains zb example.com für Beispiele! Die Stiftung Warentest wird dir dankbar sein...

ssnɹƃ
ʍopɐɥs

[stolperstein]

Das versteh ich jetzt nicht ganz!?

'ǝɯɐu$ ıɥ

<script type="text/javascript">
#test1 if {screen.availHeight 1280= screen.height} {screen.availWidth 800= screen.width}
   color:red;
</script>

<http://de.selfhtml.org/javascript/sprache/operatoren.htm#vergleich@title=ich schenk dir ein =>  ;-) und muss da nicht noch ein ODER zwischen?

<p id="test1"><a href="http://www.test.de">Wallpaper 1</a></p>

Benutze bitte die dafür Reservierten Domains zb example.com für Beispiele! Die Stiftung Warentest wird dir dankbar sein...

ssnɹƃ
ʍopɐɥs

[Shadowcrow]

'ǝɯɐu$ ıɥ

<script type="text/javascript">
#test1 if {screen.availHeight 1280= screen.height} {screen.availWidth 800= screen.width}
   color:red;
</script>

<http://de.selfhtml.org/javascript/sprache/operatoren.htm#vergleich@title=ich schenk dir ein =>  ;-) und muss da nicht noch ein ODER zwischen?

also wenn überhaupt dann etwa so:

if (screen.height == 1280) AND (screen.height == 800){  
  // tu was, get.element.by.class könnte was für dich sein  
}

Aber wie wärs wenn du dich mit den Grundlagen von JavaScript befassen würdest? Ein blick in den Quelltext der von dir genannten Seite könnte auch nicht schaden.

Und bitte sinnvoll zitieren.

ssnɹƃ
ʍopɐɥs

[Der Martin]

Hallo,

also wenn überhaupt dann etwa so:

if (screen.height == 1280) AND (screen.height == 800){

// tu was, get.element.by.class könnte was für dich sein
}

  
Javascript kennt die Schlüsselwörter AND, OR nicht als Ersatz für Symbole, daher sind &&, || angesagt.  
Abgesehen davon wäre dein Beispiel inhaltlich nicht sinnvoll: screen.height kann niemals gleichzeitig den Wert 1280 und 800 haben, die Bedingung trifft also nie zu.  
  

> Aber wie wärs wenn du dich mit den Grundlagen von JavaScript befassen würdest? Ein blick in den Quelltext der von dir genannten Seite könnte auch nicht schaden.  
  
ACK.  
  

> Und bitte sinnvoll zitieren.  
  
Dem kann ich mich nur anschließen!  
  
Ciao,  
 Martin  

-- 
Niemand ist überflüssig: Er kann immer noch als schlechtes Beispiel dienen.  

[Shadowcrow]

'ǝɯɐu$ ıɥ

also wenn überhaupt dann etwa so:

if (screen.height == 1280) AND (screen.height == 800){

// tu was, get.element.by.class könnte was für dich sein
}

>   
> Javascript kennt die Schlüsselwörter AND, OR nicht als Ersatz für Symbole, daher sind &&, || angesagt.  
  
Oh, danke...  
  

> Abgesehen davon wäre dein Beispiel inhaltlich nicht sinnvoll: screen.height kann niemals gleichzeitig den Wert 1280 und 800 haben, die Bedingung trifft also nie zu.  
  
AArrggl, Copy&Kotz Fehler, vergessen screen.height in screen.width zu ändern.  
  
  
ssnɹƃ  
ʍopɐɥs

-- 
Answers: $1, Short: $5, Correct: $25, dumb looks are still free ...

[Gunnar Bittersmann]

@@Der Martin:

nuqneH

Javascript kennt die Schlüsselwörter AND, OR nicht als Ersatz für Symbole, daher sind &&, || angesagt.

Und BTW, in PHP besteht auch ein Unterschied zwischen AND und && bzw. OR und ||.

Qapla'

[stolperstein]

Danke für eure Antworten, aber die geposteten Seiten habe ich auch über Google gefunden, allerdings kriege ich die Codeschnipsel nicht wirklich zusammen gefügt, ich habe:

<script type="text/javascript">
#test1 if {screen.availHeight 1280= screen.height} {screen.availWidth 800= screen.width}
   color:red;
</script>

<p id="test1"><a href="http://www.test.de">Wallpaper 1</a></p>

Jetzt müsste doch die Verlinkung rot dargestellt werden. Tut sie aber nicht :(

[Don P]

Hallo,

allerdings kriege ich die Codeschnipsel nicht wirklich zusammen gefügt, ich habe:
<script type="text/javascript">
#test1 if {screen.availHeight 1280= screen.height} {screen.availWidth 800= screen.width}
   color:red;
</script>

Das könnte alles mögliche sein, aber JavaScript ist es sicher nicht.
Wo hast du denn das her?

Gruß, Don P

[stolperstein]

Habe mir das aus den gepostet Links zusammen gesucht.
Ich sag ja ich habe keine Ahnung wie man das Anstellen soll :(

» Hallo,

allerdings kriege ich die Codeschnipsel nicht wirklich zusammen gefügt, ich habe:
<script type="text/javascript">
#test1 if {screen.availHeight 1280= screen.height} {screen.availWidth 800= screen.width}
   color:red;
</script>

Das könnte alles mögliche sein, aber JavaScript ist es sicher nicht.
Wo hast du denn das her?

Gruß, Don P

[Don P]

Hallo,

Habe mir das aus den gepostet Links zusammen gesucht.
Ich sag ja ich habe keine Ahnung wie man das Anstellen soll :(

k.A. von JavaScript, das merkt man. Die Syntax ist total falsch. Nicht gut, wenn man etwas programmieren will und die Sprache so gar nicht kennt. Alles mal kurz erklären ist zuviel verlangt und alles für dich fertig programmieren auch.

Vielleicht kennst du ja jemanden, der das für dich macht (ist nicht wirklich schwer) oder sonst musst du halt jemanden beauftragen oder JavaScript SELF lernen. Lies z.B. mal unter in SELFHTML unter if, wie man eine Abfrage und einen Vergleich notiert (Vergleichsoperatoren), wie man ein HTML-Element (DOM) raussucht (getElementByID oder getElementsByTagName), wie man css-Eigenschaften setzt (classname). Dann solltest du es hinbekommen, im Prinzip so:

• das oder die Link-Element(e) ermitteln, deren Farbe du anpassen willst, z.B. mit mit getElementByID() oder getElementsByTagName()
• mit einer oder mehreren if-Abfragen screen.height und scrren.width ermitteln
• und jeweils das classname-Attribut für den oder die Links entsprechend setzen (die Farben sollten im CSS bereits definiert sein)

Viel Spass,
Don P

[Gunnar Bittersmann]

@@Don P:

nuqneH

• und jeweils das classname-Attribut […]

Ein solches gibt es nicht (in HTML), sondern "class". Und eine solche Eigenschaft gibt es nicht (in JavaScript), sondern "className".

[…] für den oder die Links entsprechend setzen

Och nö! Wie oft muss man das denn hier noch erzählen, dass es unsiinig ist, sich mühsam alle Links aus dem DOM rauszupicken. Es genügt völlig, einem übergeordneten Element ('body' oder 'html' bieten sich an) einmalig eine Klassenzugehörigkeit (sagen wir "L", "M" bzw. "S") zu verpassen:

if (…)      document.body.className += " L";  
else if (…) document.body.className += " M";  
else (…)    document.body.className += " S";

Die 'a'-Elemente sind statisch im Markup entsprechend klassifiziert ("L", "M" bzw. "S"):

<ul>  
  <li>Motiv 1  
     <ol>  
       <li><a class="L" href="…">groß</a></li>  
       <li><a class="M" href="…">mittel</a></li>  
       <li><a class="S" href="…">klein</a></li>  
     </ol>  
  </li>  
  <li>Motiv 1  
     <ol>  
       <li><a class="L" href="…">groß</a></li>  
       <li><a class="M" href="…">mittel</a></li>  
       <li><a class="S" href="…">klein</a></li>  
     </ol>  
  </li>  
</ul>

(die Farben sollten im CSS bereits definiert sein)

Na wenigstens CSS kennst du. ;-) Den Nachfahrenselektor auch?

body.L a.L, body.M a.M, body.S a.S { color: red }

Qapla'

[Don P]

Hallo,

Ein solches gibt es nicht (in HTML), sondern "class". Und eine solche Eigenschaft gibt es nicht (in JavaScript), sondern "className".

Zum Glück gibt es Pedanten, die solche Ungenauigkeiten dann richtigstellen ;). classname oder className muss ich jedesmal nachschlagen, solche Details belasten nur unnötig mein Langzeitgedächtnis. Man kommt dann beim Suchen schon drauf. "Attribut" schrieb ich halt, weil es genau wie ein class-Attribut im Markup wirkt. Streng genommen ist es natürlich keins, ok, aber der Browser setzt dafür eins ein.

Och nö! Wie oft muss man das denn hier noch erzählen, dass es unsinnig ist, sich mühsam alle Links aus dem DOM rauszupicken. [...]

Mit einem so schönen Beispiel hab' ich's aber noch nie gesehen :) Danke!

Die 'a'-Elemente sind statisch im Markup entsprechend klassifiziert

Kann für viele Links aber schnell mühsamer werden als sie mit ein bisschen JS-Code aus dem DOM rauszupicken :P
Oder beziehst du "mühsam" auf den bedauernswerten Rechner?

(die Farben sollten im CSS bereits definiert sein)

Na wenigstens CSS kennst du. ;-)

Da staunste, was? ;)

Den Nachfahrenselektor auch?

Klar doch. Nur mit den Prioritäten der Selektoren habe ich noch so meine Mühe...

Gruß, Don P

[Gunnar Bittersmann]

@@Don P:

nuqneH

Kann für viele Links aber schnell mühsamer werden als sie mit ein bisschen JS-Code aus dem DOM rauszupicken :P

Hier wohl nicht gegeben.

Oder beziehst du "mühsam" auf den bedauernswerten Rechner?

Ja. ;-)

Nur mit den Prioritäten der Selektoren habe ich noch so meine Mühe...

Du meinst nicht Prioritäten, sondern Spezifitäten. „Zum Glück gibt es Pedanten […]“ ;-)

Qapla'