|
|||
Fadenkreuz auf Bild
Hallo!
Ich habe heute den ganzen Nachmittag damit verbracht bei Google ein passendes Script für mein Vorhaben zu suchen. Ich benötige ein Fadenkreuz-Script, welches mir ein Fadenkreuz auf ein Bild zaubert. Ich habe einen Ausschnitt aus einer Landkarte (immer 300x300 pixel groß) und auf diesem Bild sollte genau die Mitte mit einem Fadenkreuz gekennzeichnet werden. Leider habe ich von Javascript keine Ahnung und weiß auch nicht, wie ich es sonst lösen sollte. Kann mir da vielleicht einer von euch weiterhelfen? Vielen Dank Skullsplitter |
Sponsored Links |
Sponsored Links |
|
|||
Ich schätze mal, das ist so gemeint (Nur als Ansatz gedacht):
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html lang="de" xmlns="http://www.w3.org/1999/xhtml" xml:lang="de"> <head> <title>simple document</title> <style type="text/css"> span.a a { background: red; } </style> <script type="text/javascript"> function init() { document.getElementById('container').onmousemove = function(e) { document.getElementById('divX').style.width = e.clientX + 'px'; document.getElementById('divY').style.height = e.clientY + 'px'; } }; </script> </head> <body onload="init()"> <div id="container" style="position: relative; height: 300px; width: 300px; background: #CCCCCC;"> <div id="divX" style="position: absolute; top: 0px; left: 0px; border-right: 1px solid #000000; height: 100%;"></div> <div id="divY" style="position: absolute; top: 0px; left: 0px; border-bottom: 1px solid #000000; width: 100%;"></div> </div> </body> </html>
__________________
... Meine Meinung |
|
||||
Ich würde vor
Code:
document.getElementById('divX').style.width = e.clientX + 'px'; Code:
if (!e) { e = window.event; }
__________________
|
|
|||
Das stimmt - War ja auch nur ein Ansatz ohne irgendwelche Absicherung
EDIT: Mir fällt auch gerade auf, dass die Lösung über die Veränderung der Größe nicht optimal ist, weil dann evtl. andere Elemente überlagert werden. Besser wäre wohl, wenn die Divs nur eine "Dicke" von 1px haben und das Kreuz über die Links-/Rechts-Position gesteuert wird.
__________________
... Meine Meinung Geändert von xm22 (03.09.2009 um 16:23 Uhr) |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Bild durch Bild ersetzten! (a:hover) | Prof. Awesome | CSS | 11 | 16.03.2011 15:33 |
Bild als Active makieren | siriussmarty | CSS | 0 | 08.07.2010 15:37 |
Bild über Bild | rafa | CSS | 2 | 24.01.2010 19:46 |
Bild über Bild legen mit position: relative (IE6 Problem) | naitsab | CSS | 3 | 09.06.2009 14:20 |
Verflixter Rahmen um ein Bild | Webelix | CSS | 6 | 22.07.2007 13:32 |