judo99
Goto Top

HTML, CSS: Mapping auf dynamischen Hintergrund

Ist es möglich, einerseits ein Bild als Hintergrundbild zu verwenden, welches auf allen möglichen Bildschirmgrößen voll skaliert wird und bei dem abhängig von der Skalierung der Map-Tag von HTML nutzbar ist?
Versucht habe ich schon folgenden Code:
html {
                background: url(Test.jpg) no-repeat center center fixed;
                -webkit-background-size: cover;
                -moz-background-size: cover;
                -o-background-size: cover;
                background-size: cover;
            }

Das bewirkt aber nur einen skalierbarer Hintergrund, auf dem sich aber keine Map definieren lässt. Weiterhin wird es mobil auch nicht optimal dargestellt, da durch die Skalierung die Bildränder verloren gehen.
Gibt es eine Möglichkeit mit skalierbaren Divs oder kann man mit meiner Methode irgendwie ein Mapping einbinden?

Vielen Dank im vorraus

Content-Key: 329950

Url: https://administrator.de/contentid/329950

Ausgedruckt am: 19.03.2024 um 06:03 Uhr

Mitglied: falscher-sperrstatus
falscher-sperrstatus 19.02.2017 um 16:32:59 Uhr
Goto Top
Hallo Judo,

hierbei wirst du um JS nicht herumkommen, da sonst zum einen das Bild nicht optimal angepasst wird und zum anderen die Map Tags vermutlich z.T ausserhalb des Bildes, z.T ausserhalb des gewünschten Scopes sein werden.

VG
Mitglied: derRAV3N
derRAV3N 20.02.2017 um 10:29:55 Uhr
Goto Top
Ich bin im HTML/CSS zwar eher Hobbymäßig unterwegs, aber guck mal nach der CSS Maßeinheit vh(viewheight) und vw(viewwidth) für height und width. Vielleicht hilft dir das.