Frage

ich ein Stylesheet für Desktops, und eine andere für Handhelds. Die Webseite zeigt einige Bilder, wenn auf dem Desktop angezeigt, sondern versteckt diese Bilder, wenn sie auf Handhelds angezeigt. Die Seite erscheint als für beide Desktops und Handhelds entwickelt.

Wenn ich die Serverprotokolle überprüfen, finde ich, dass der Handheld eigentlich noch die Bilder geladen wird, nur nicht angezeigt werden. Gibt es eine Möglichkeit den Handheld aus dem Laden der Bilder vollständig zu stoppen, da sie sie nicht benötigen, ohne dass zwei Sätze von Web-Seiten zu halten? Kann es mit nur Sheets getan werden?

Vielen Dank im Voraus.

Ray Mond

War es hilfreich?

Lösung

Fügen Sie die Bilder, die Sie nicht wollen, auf den mobilen Geräten als Hintergrundbild angezeigt werden soll. Im Browser Sheet können Sie dann verwenden,

.element { 
    background: #FFF url('image.png') no-repeat left top; /* or whatever */
}

, während in dem Handheld-Stylesheet Sie nicht nur ein Hintergrundbild gesetzt, so, über die genaue Verwendung abhängig, könnten Sie verwenden

.element {
    display: none;
}

oder

.element { 
    background: #FFF;
}

Allerdings wird es nicht möglich sein, Bilder entfernen Sie mit <img src="" /> sind danach durch CSS-Regeln (nur display: none etc, aber das würde sich nicht von Laden zu stoppen, wie Sie vielleicht bemerkt).

Andere Tipps

Senden Sie Ihre Sheet per HTTP-Header vor Markup:

Link: <compact.css>; rel="stylesheet"; media="handheld"

Dann ist die am häufigsten verwendete Handheld-Browser - Opera - werden die Bilder nicht geladen werden. WebKit (Safari) noch der Fall ist, aber - auch Hintergrundbilder für versteckte Elemente

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top