Hintergrundbild bei Responsive Design skalieren 
Autor: Jan P.
Besucht 256,
Followers 1,
Geteilt 0
Auf meiner Seite malomy.de habe ich am PC Browser die Hintergrundbilder alle gut sichtbar. Wenn ich aber im Repsonive mit dem Hand schauen, werden die Bilder nicht runterskaliert. Ich sehe dort immer nur Ausschnitte. Möchte aber dort das jeweilige Bild richtig sehen? Wie geht das?
Einstellungen bisher:
jeweilige Seite dann Eigenschaten, Grafik,an Fenster anpassen, Zentriert und im Hintergrund fixiert sind ausgewählt.
Gepostet am
Es kann sich nicht verändern, denn wenn es sich anpasst, würde unterhalb ein weisser Bereich
entstehen mit den Objekten die du eingefügt hast.
Das ganze was du willst, würde voraussetzen, dass die Objekte auch komplett verkleinert
werden oder geschrumpft.
Da könnte ich dann gleich auf responsive verzichten und nur auf Destopvariante einstellen.
Autor
Okay, gibt es eine Umgehungslösung? Das sieht doch so Sch... aus?
Bilder kann man auch in einem Textobjekt platzieren. Die werden dann unter Beibehaltung ihres Seitenverhältnis an den Viewport angepasst.
Wenn du diesen Weg wählst, muss tu aber die Homepage anders gestalten, da du nichts vor dem Textobjekt platzieren kannst (Stichwort: Ebene/Layer).
Für die anderen Seiten wäre das sicher eine unmittelbare Alternative.
Autor
Danke. Das kann ich wohl so nicht lösen. Kann ich aber in der Eingangseite eine "Erkennung" ob Handy oder nicht einbauen und dann auf einem anderen Ordner der Webseite umleiten? D.h. 2 Projekte in 2 Ordnern eins für Hohe Auflösungen und eines für Handy? Ginge das?
JA, das geht schon. Aber das würde noch vor dem responsiven Design gemacht noch mit der V9 bis zur V12! Damals musste man es so machen und ein Skript einbauen das erkennt wenn man am Handy auf deine Seite gelangt. Ob das heute noch funktioniert weis ich nicht, weil die Geräte ja modern geworden und mehr Pixel Auflösung haben zwischenzeitlich. Das Skript müsste irgendwo im anderen Forum sein.
Autor
Skrip geht:
<script type="text/javascript"><!--
if (screen.width < 480) {
window.location.href = "http://www.malomy.de/mobile";
}
//-->
</script>