zurück zur Startseite
  


Zurück XHTMLforum > Webentwicklung (außer XHTML und CSS) > Serveradministration und serverseitige Scripte
Seite neu laden Adaptive images

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 02.11.2012, 14:42
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 06.04.2005
Beiträge: 67
dr_colossos befindet sich auf einem aufstrebenden Ast
Standard Adaptive images

Hallo zusammen,
ich bekomme trotz einfacher Anleitung die Sache mit den Adaptive Images nicht zum Laufen. Habe mal eine Testseite aufgesetzt: Testseite adaptive images / unter "About" und der rechten Spalte sollte eigentlich ein Bild sein. Nur wenn ich die htaccess auskommentiere werden diese auch gezeigt.
  • Habe den Ordner "ai-cache" im Root erstellt mit Rechten 777
  • Den JS-Snippet in den Header der Seite eingebunden
  • Meine htaccess siehe unten ..
  • adaptive-images.php angelegt und unter $resolution auf die TwitterBootstrap Werte geändert.

Alles brachte nicht den gewünschten Erfolg ... ich weiß echt nicht weiter.
PHP Version ist 5.3. phpinfo()
HTML-Code:
<IfModule mod_rewrite.c>
  Options +FollowSymlinks
  RewriteEngine On

  RewriteCond %{REQUEST_URI} img

  # don't apply the AI behaviour to images inside AI's cache folder:
  RewriteCond %{REQUEST_URI} !ai-cache
    

  
  RewriteRule \.(?:jpe?g|gif|png)$ adaptive-images.php
  # wenn ich diese Zeile auskommentiert sehe ich die Bilder, damit muss es zu tun haben


</IfModule>
Hier noch die Firebug meldung: keine IMG url gefunden:
Angehängte Grafiken
Dateityp: png Bildschirmfoto 2012-11-02 um 14.38.21.png (42,9 KB, 3x aufgerufen)

Geändert von dr_colossos (02.11.2012 um 14:50 Uhr)
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 02.11.2012, 15:50
Benutzerbild von Thielo
Web Ninja
XHTMLforum-Kenner
 
Registriert seit: 17.09.2009
Ort: Stuttgart oder so
Beiträge: 3.379
Thielo ist ein LichtblickThielo ist ein LichtblickThielo ist ein LichtblickThielo ist ein LichtblickThielo ist ein LichtblickThielo ist ein Lichtblick
Standard

Meldung, das das Bild auswirf:
Zitat:
The requested URL /kunden/279045_32657/webseiten/nbvfx/_test/adaptive-images.php was not found on this server.
Vllt liegts am Pfad, vllt ist der falsch gesetzt?
__________________
Hier ein immer gültiges Statement: Überarbeite deine Code, lerne die Grundlagen, widersprich mir nicht, wehre dich nicht, ich habe Recht, wir sind Lolgion, wir sind viele.. potato...
All meine Angaben sind ohne Gewähr, es könnte also trotz meiner Unfehlbarkeit dazu kommen dass ich falsch liege

www.richard-thiel.de | Müssen Websiten überall gleich ausschauen?
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 02.11.2012, 16:27
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 06.04.2005
Beiträge: 67
dr_colossos befindet sich auf einem aufstrebenden Ast
Standard

Das Bild ist auf dem Server unter diesem Pfad erreichbar.

Ich kommentiere die HTACCESS-Zeilen aus und ich sehe meine Bilder. Daran kann es nicht liegen ...

Es muss an der htaccess liegen .. ich habe es aber wie auf "adaptive images" gezeigt gemacht.


Kein Plan?
Mit Zitat antworten
  #4 (permalink)  
Alt 02.11.2012, 17:11
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

Hast du mal versucht die RewriteBase zu setzen? Bei einigen Hostern ist das nötig.

In deinem Beispiel:
Code:
RewriteBase /_test/
Mit Zitat antworten
  #5 (permalink)  
Alt 02.11.2012, 19:38
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 06.04.2005
Beiträge: 67
dr_colossos befindet sich auf einem aufstrebenden Ast
Standard

Hallo,

danke das zeigt mir zumindest die Bilder. Das RewriteBase war es.

Nur dachte ich es werden jetzt bei jeder Auflösung Bilder ins Verzeichnis "ai-cache" geschrieben. Wird es aber nicht.

Wenn ich den Browser kleiner ziehe und mir die Grafikinfo anzeigen lasse steht da:1200px × 900px (Skaliert zu 730px × 548px), dachte das Bild wird dann kleiner gerechnet und ausgegeben aus dem Ordner "ai-cache/980/xy.jpg"

Oder?

http://nbvfx.net/_test/about.html
Angehängte Grafiken
Dateityp: png Bildschirmfoto 2012-11-02 um 19.38.43.png (28,7 KB, 2x aufgerufen)

Geändert von dr_colossos (02.11.2012 um 19:50 Uhr)
Mit Zitat antworten
  #6 (permalink)  
Alt 05.11.2012, 10:40
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 06.04.2005
Beiträge: 67
dr_colossos befindet sich auf einem aufstrebenden Ast
Standard

Neuer Testlink .. testseite ich meine das jetzt alles funktioniert, im Ordner "ai-cache" ist ein Ordner angelegt "1200/_ai/img/bild1.jpg" etc.

Leider ist aber nur ein Ordner "1200" für die Auflösung zu sehen. Dachte da gibt es jetzt vier Ordner laut meiner PHP-Datei

PHP-Code:
$resolutions   = array(1200980767480); // the resolution break-points to use (screen widths, in pixels) 
css
HTML-Code:
@media (min-width: 1200px) { ...

@media (min-width: 980px) { ...

@media (min-width: 768px) and (max-width: 979px) {

@media (max-width: 480px) { ...
Im Frontend über GrafikInfo ist die Datei auch immer gleich groß ...?! AUch die Quelle ist : http://nbvfx.net/_ai/img/IMGP0447.jpg und nicht http://nbvfx.net/_ai/ai-cache/AUFLÖS...g/IMGP0447.jpg


htaccess
HTML-Code:
<IfModule mod_rewrite.c>
  Options +FollowSymlinks
  
  RewriteEngine On
  
  RewriteBase /_ai/
  
  # Adaptive-Images -----------------------------------------------------------------------------------

  # Add any directories you wish to omit from the Adaptive-Images process on a new line, as follows:
  # RewriteCond %{REQUEST_URI} !ignore-this-directory
  # RewriteCond %{REQUEST_URI} !and-ignore-this-directory-too
  
  RewriteCond %{REQUEST_URI} img
  

  # don't apply the AI behaviour to images inside AI's cache folder:
  RewriteCond %{REQUEST_URI} !ai-cache
    
  # Send any GIF, JPG, or PNG request that IS NOT stored inside one of the above directories
  # to adaptive-images.php so we can select appropriately sized versions
  RewriteRule \.(?:jpe?g|gif|png)$ adaptive-images.php

  
  # test if your .htaccess-file is correct - every image will be overwritten with test.jpg
  # RewriteRule .(?:jpe?g|gif|png)$ test.jpg
  
  # END Adaptive-Images -------------------------------------------------------------------------------
</IfModule>

Geändert von dr_colossos (05.11.2012 um 10:57 Uhr)
Mit Zitat antworten
  #7 (permalink)  
Alt 05.11.2012, 10:53
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

Ich vermute mal die kleinere Grafiken werden erst generiert, wenn sie angefordert werden. So habe ich das jedenfalls beim Überfliegen des Codes in Erinnerung behalten.

Hast du die Seite mal mit einem kleineren Gerät aufgerufen? Die Fenstergröße zu ändern reicht nicht, da du dich mit Math.max(screen.width, screen.height) auf das Ausgabegerät und nicht auf die Fenstergröße beziehst.
Mit Zitat antworten
  #8 (permalink)  
Alt 05.11.2012, 12:18
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 06.04.2005
Beiträge: 67
dr_colossos befindet sich auf einem aufstrebenden Ast
Standard

Genau das war es! habe gerade nebenbei nach der Lösung geschaut und folgendes gefunden: https://github.com/MattWilcox/Adaptive-Images/issues/52



So wie ich die "adaptive-images" eingebaut habe stimmt alles.
Meine Rechner habt eben mehr als 1200px, daher werden auch nur die großen Bilder generiert. Bei einer kleineren Auflösung wird auch der Ordner "480" usw erstellt.

So kann man es testen, statt dem JS-Code folgendes eintragen:
HTML-Code:
<script>document.cookie='resolution='+480+'; path=/';</script>
somit simuliert man eine Auflösung von 480px und der Ordner wird in den "ai-cache" geschrieben.

Danke auch an "inta" ... du hattest dir richtige Vermutung.


Gruß
Mit Zitat antworten
  #9 (permalink)  
Alt 05.11.2012, 12:54
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 dr_colossos Beitrag anzeigen
So kann man es testen, statt dem JS-Code folgendes eintragen:
HTML-Code:
<script>document.cookie='resolution='+480+'; path=/';</script>
somit simuliert man eine Auflösung von 480px und der Ordner wird in den "ai-cache" geschrieben.
Oder du nimmst folgendes:
HTML-Code:
<script>
	document.cookie='resolution='+Math.max(window.innerWidth, window.innerHeight)+'; path=/';
</script>
… dann werden die Grafiken je nach Fenstergröße generiert (wobei ich nicht verstehe warum man die Höhe mit einbeziehen sollte, eigentlich reicht es sich nur auf die Breite zu beziehen).

Zitat:
Zitat von dr_colossos Beitrag anzeigen
Danke auch an "inta" ... du hattest dir richtige Vermutung.
Bitte, gerne
Mit Zitat antworten
Sponsored Links
Antwort

Stichwörter
adaptive, design, images, responsive

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
Images als Hyperlink, aber ohne blau Linkmarkierung?? lilly246 CSS 2 04.04.2009 21:55
Images in der Zeile ausrichten? akb CSS 2 26.08.2006 18:12
images nebeneinander floaten lassen und hspace nexus6 CSS 6 07.04.2004 13:26
images nahtlos mit css-boxen auflisten capitano CSS 2 22.02.2004 23:37


Alle Zeitangaben in WEZ +2. Es ist jetzt 15:25 Uhr.