zurück zur Startseite
  


Zurück XHTMLforum > Webentwicklung (außer XHTML und CSS) > Javascript & Ajax
Seite neu laden Erkennen ob JavaScript deaktiviert ist und anderen Inhalt anzeigen

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 31.01.2011, 11:30
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 10.12.2005
Beiträge: 41
Ares befindet sich auf einem aufstrebenden Ast
Standard Erkennen ob JavaScript deaktiviert ist und anderen Inhalt anzeigen

Hallo!

Ich verwende auf meiner Webseite ein JavaScript um mehrere Bilder nacheinander in einem "Slider" anzuzeigen.

Im HTML-Text sind die Bilder einfach in einer Liste aufgezählt, die korrekt Anzeige übernimmt dann das JavaScript:

HTML-Code:
 <div id="slider">
  <ul>
    <li><img src="images/01.jpg" alt="" /></li>
    <li><img src="images/02.jpg" alt="" /></li>
    <li><img src="images/03.jpg" alt="" /></li>
    <li><img src="images/04.jpg" alt="" /></li>
    <li><img src="images/05.jpg" alt="" /></li>
   </ul>
 </div>
Das Funktioniert alles prima. Aber wenn JavaScript nicht aktiviert ist, werden die Bilder natürlich nicht nacheinander angezeigt sondern erscheine alle in der Liste. Das sprengt dann leider mein Design.

Für den Fall, dass JavaScript nicht aktiv ist, wäre es kein Problem nur ein Bild anzuzeigen. Aber wie erkenne ich diesen Fall?

Ich brauche quasi etwas in der Form:

Code:
if (JavaScript Aktiv) then
   <ul>
      <li>"Liste mit allen Bilder"</li>
      <li>"mit"</li>
      <li>"Bilder"</li>
   <ul>
else
   <ul>
      <li>"nur ein Bild"</li>
   <ul>
endif
Mit dem noscript-Tag kann ich den ELSE-Teil zwar realisieren, aber nicht den IF-Teil.

Wie löst man so etwas richtig?

Besten Dank
Ares
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 31.01.2011, 11:50
Benutzerbild von inta
free as in freedom
XHTMLforum-Kenner
 
Registriert seit: 04.12.2006
Ort: Berlin
Beiträge: 5.025
inta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz sein
Standard

Da gibt es verschiedene Möglichkeiten.

Du kannst alle bis auf das erste Bild per CSS ausblenden, bei Darstellung ohne CSS wären dann wieder alle Bilder zu sehen. Wieder sichtbar machst du die versteckten Bilder natürlich mit Javascript. Besser als ausblenden wäre hier ein Galerie die nur mit CSS funktioniert und bei aktiviertem Javascript dann durch deine Javascript-Galerie ersetzt bzw. erweitert wird.

Du kannst nur ein Bild angeben und alle weiteren per Ajax/Javascript nachladen, ohne Javascript gibt es dann immer nur ein Bild zu sehen. Das kostet allerdings einen weiteren Request und eine längere Wartezeit bis die Galerie dargestellt wird.

Das nur mal in aller Kürze als Ideen.
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 31.01.2011, 13:20
Benutzerbild von David
auch, ja!
XHTMLforum-Kenner
 
Registriert seit: 08.11.2007
Beiträge: 2.630
David ist ein wunderbarer AnblickDavid ist ein wunderbarer AnblickDavid ist ein wunderbarer AnblickDavid ist ein wunderbarer AnblickDavid ist ein wunderbarer AnblickDavid ist ein wunderbarer AnblickDavid ist ein wunderbarer Anblick
Standard

Zitat:
Zitat von inta Beitrag anzeigen
Das kostet allerdings einen weiteren Request und eine längere Wartezeit bis die Galerie dargestellt wird.
Die Requests hast Du doch sowieso, wenn Du die Bilder komplett in den Quelltext schreibst.

Ich handhabe es so, dass ich zwei Bilder im Quelltext habe, die ich per JavaScript übereinander lege. Das obere blendet aus, die Stapelung wird getausch und dann läd das hintere bild neu. Das hat den Vorteil, dass bei deaktiviertem JS nur zwei Bilder geladen werden, anstatt alle. (Vor allem für Handhelds sinnvoll).

Wenn Du wirklich nur ein Bild anzeigen willst, falls JS deaktiviert ist, dann kannst Du das zweite (und jedes weitere) Bildelement dynamisch mit JS generieren.
__________________
github | http://dnaber.de
Mit Zitat antworten
  #4 (permalink)  
Alt 31.01.2011, 14:08
Benutzerbild von inta
free as in freedom
XHTMLforum-Kenner
 
Registriert seit: 04.12.2006
Ort: Berlin
Beiträge: 5.025
inta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz sein
Standard

Zitat:
Zitat von David Beitrag anzeigen
Die Requests hast Du doch sowieso, wenn Du die Bilder komplett in den Quelltext schreibst.
Nein, ohne Ajax hast du einen Request weniger.

Ohne Ajax:
1 Request für die Seite + 5 Requests für die Bilder = 6 Requests

Mit Ajax:
1 Request für die Seite + 1 Request für das erste Bild + 1 asynchroner Request + 4 Requests für die restlichen Bilder = 7 Requests

Ein asynchroner Request lohnt sich meiner Meinung nach nur, wenn er nicht immer ausgeführt wird, also zum Beispiel nur auf Anfrage durch den Nutzer.
Mit Zitat antworten
  #5 (permalink)  
Alt 01.02.2011, 16:20
Benutzerbild von David
auch, ja!
XHTMLforum-Kenner
 
Registriert seit: 08.11.2007
Beiträge: 2.630
David ist ein wunderbarer AnblickDavid ist ein wunderbarer AnblickDavid ist ein wunderbarer AnblickDavid ist ein wunderbarer AnblickDavid ist ein wunderbarer AnblickDavid ist ein wunderbarer AnblickDavid ist ein wunderbarer Anblick
Standard

Nur zum Verständnis, wonach fragt denn der asynchrone Request, wenn nicht nach einem Bild?
__________________
github | http://dnaber.de
Mit Zitat antworten
  #6 (permalink)  
Alt 01.02.2011, 22:57
Benutzerbild von inta
free as in freedom
XHTMLforum-Kenner
 
Registriert seit: 04.12.2006
Ort: Berlin
Beiträge: 5.025
inta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz sein
Standard

In der Regel bekommt man einen JSON-String zurück, in welchem sich die nötigen Informationen zu den Bildern befinden. Es kann auch fertiges HTML sein.

Warum sollte ein asynchroner Request nach einem Bild fragen? Um das tun zu können, müsste die URL ja schon bekannt sein und dann könnte man sie auch gleich in ein img-Element einsetzen und das Bild würde automatisch geladen.
Mit Zitat antworten
  #7 (permalink)  
Alt 02.02.2011, 11:25
Benutzerbild von David
auch, ja!
XHTMLforum-Kenner
 
Registriert seit: 08.11.2007
Beiträge: 2.630
David ist ein wunderbarer AnblickDavid ist ein wunderbarer AnblickDavid ist ein wunderbarer AnblickDavid ist ein wunderbarer AnblickDavid ist ein wunderbarer AnblickDavid ist ein wunderbarer AnblickDavid ist ein wunderbarer Anblick
Standard

Offenbar mangelt es mir hier an den Definitionen der Fachbegriffe.
Oder ich denke zu unkompliziert. ^^

Du meinst, ein Bild ist im Quelltext als HTML untergebracht und das Script fragt erst nach den URLs der anderen Bildern beim Server nach ala "GET /return-galery-info?id=1" und bekommt ein JSON-String zurück in dem die Meta-infos stehen?
Das wäre natürlich wirklich ein Request zu viel.

Ich rufe meine Slideshow in etwa so auf:
Code:
slider = new Slideshow(el containerElement, array imgList, array args);
In imgList stehen alle URLs sowie width/height werte bereits drin. (Wird Serverseitig im Backend festgelegt und dynamisch zusammengesetzt) Damit erspare ich weitere Requests auf Bilder, wenn z.B. kein JS aktiviert ist.
__________________
github | http://dnaber.de
Mit Zitat antworten
  #8 (permalink)  
Alt 02.02.2011, 12:45
Benutzerbild von inta
free as in freedom
XHTMLforum-Kenner
 
Registriert seit: 04.12.2006
Ort: Berlin
Beiträge: 5.025
inta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz seininta kann auf vieles stolz sein
Standard

Zitat:
Zitat von David Beitrag anzeigen
Du meinst, ein Bild ist im Quelltext als HTML untergebracht und das Script fragt erst nach den URLs der anderen Bildern beim Server nach ala "GET /return-galery-info?id=1" und bekommt ein JSON-String zurück in dem die Meta-infos stehen?
Genau.

Zitat:
Zitat von David Beitrag anzeigen
Ich rufe meine Slideshow in etwa so auf:
Code:
slider = new Slideshow(el containerElement, array imgList, array args);
In imgList stehen alle URLs sowie width/height werte bereits drin. (Wird Serverseitig im Backend festgelegt und dynamisch zusammengesetzt) Damit erspare ich weitere Requests auf Bilder, wenn z.B. kein JS aktiviert ist.
So ginge es auch ja, aber dann kann man die Grafiken auch gleich ins HTML stecken (sofern man alle anzeigt).
Mit Zitat antworten
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Klasse funktioniert nicht (.pdf) Guitarrero CSS 5 18.08.2010 18:55
Problem mit position:relative; McCoRmIcK CSS 0 08.04.2007 16:23
Problem mit verschachtelten Div's Sombreo CSS 9 22.07.2004 21:49
Inhalt immer im Container #Inhalt anzeigen. schnippi CSS 7 07.04.2004 17:02
Breite von DIVs Daniel CSS 8 23.06.2003 18:01


Alle Zeitangaben in WEZ +2. Es ist jetzt 02:07 Uhr.