✔ Link mit Onmouseover bestimmen

  • Themenstarter Themenstarter Jammy
  • Beginndatum Beginndatum
J

Jammy

Hallo,

ich suche jetzt schon seit Stunden nach einer Lösung aber finde keine, vielleicht könnt ihr mir ja helfen. Folgendes:

Wie komme ich (per Javascript) an einen Link über den ich mit der Maus fahre?
Also z.B. bei einer Suchmaschine will ich eine Mini-Vorschau auf zu einem Suchergebnis, wenn ich mit der Maus über das jeweilige Ergebnis fahre. Das Vorschaufenster hab ich soweit schon hinbekommen, nur klappt das mit dem Auslesen des Links nicht.

Habe mir folgendes gedacht:

Code: 
window.addEventListener('focus', function(event){
var target = event.target
if(target.tagName=="LI"){
var firstHref = target.getElementsByTagName('a')[0].href

nur leider klappt das überhaupt nicht. Es wird kein Event ausgelöst, wenn ich über ein Suchergebnis fahre.

Kann mir vielleicht wer ein Beispiel zeigen, wie so ein Mouse-Effekt aussehen müsste?

Mit Google fand ich schon ein paar Sachen, aber da wurde das direkt im HTML-Code gelöst und daraus wurde ich nicht schlau.
 
Hi,

ermittel im onload-Event des Dokuments alle enthaltenen Links. Durchlaufe diese in einer for-Schleife und statte sie mit entsprechenden Eventhandlern aus.

Beispiel:
Code: 
<html>
<head>
<title>www.tutorials.de</title>
<meta name="author" content="Quaese">
<script type="text/javascript">
<!--
// MouseOver-Eventhandler
function hMouseOver(objEvt){
  // Richtiges Eventobjekt ermitteln
  objEvt = (window.event)? window.event : objEvt;
  // Auslösendes Element ermitteln
  var objTarget = (objEvt.target)? objEvt.target : objEvt.srcElement;

  // ToDo: Weiterverabeiten (hier: Ausgabe des Ziels)
  alert(objTarget.href);
}

window.onload = function(){
  // Alle Links im Dokument in Array
  var arrLnk = document.getElementsByTagName("a");

  // Alle Links durchlaufen
  for(var i=0; i<arrLnk.length; i++){
    // MouseOver-Eventbehandlung zuweisen
    if(arrLnk[i].addEventListener){
      arrLnk[i].addEventListener("mouseover", function(evt){ hMouseOver(evt);}, false);
    }else if(arrLnk[i].attachEvent){
      arrLnk[i].attachEvent("onmouseover", function(){ hMouseOver();});
    }
  }
}
-->
</script>
</head>
<body>
<a href="http://www.tutorials.de/">tutorials.de</a><br>
<a href="http://www.canvas.quaese.de/">canvas.quaese.de</a>
</body>
</html>

Ciao
Quaese
 
Vielen Dank, werde das mal ausprobieren. Sieht vielversprechend aus.

##EDIT##

Kurze Rückmeldung: Es klappt. Vielen Dank.
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück