Teil eines Bildes anzeigen
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
anzeigen
berechnen
bild
code
dank
dasein
effekt
eigenschaft
funktionierendes beispiel
gesamtbild
http
inhalt
kurzer hand
rahmen
schwierigkeit
teil
teilabschnitt
url
verdeutlichung
verschieben
-
Hallo liebe Limanianer,
ich habe mich kurzer Hand dazu entschlossen, meinen Code in eine reines HTML 4 Konstrukt umzuwandeln um so den Canvas Teil zu umgehen. Hierdurch ergibt sich nun die Schwierigkeit, dass ich gerne von einem Gesamtbild nur einen Teilabschnitt anzeigen lassen würde. Dies kommt daher, dass sich das Bild mit der Mausposition verschieben soll ohne dabei aus dem Frame geschoben zu werden (was zu Scrollbalken führen würde). Gibt es für diesen Effekt eine Möglichkeit ohne ein Canvaselement?
Beste Grüße und Danke im Voraus! -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
Das erreichst Du durch css, overflow: hidden.
Funktionierendes Beispiel:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title></title> <style type="text/css"> #rahmen {width: 200px; height: 200px; border: solid 1px #000; position: relative; overflow: hidden;} #bild {position: absolute; top: 100px; left: 100px; border: solid 1px #f00;} </style> </head> <body> <div id="rahmen"> <img id="bild" src="http://www.lima-city.de/images/avatar/ZPq06GvcAqN3xxo.jpeg" </div> </body> </html>
Die Rahmen(border) sind natürlich nur zur Verdeutlichung
Siehe auch overflow bei selfhtml -
Genau nach sowas habe ich gesucht. Das ersetzt meine Canvas interpretation vollkommen. Gibt es eigentlich noch irgendeine andere Anwendungsmöglichkeit für die Zeichenfläche, außer für 3D Inhalte was ihr Dasein berechtigen würde? Gäbe es eventuell die Möglichkeit Inhalte Hardwarebeschleunigt z.B. über Shader berechnen zu lassen oder ist dies den lokalen Programmen vorbehalten?
-
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage