2011-01-15 2 views
0

Grundsätzlich verwende ich verschiedene div, um Abschnitte des Textes hervorzuheben. Grundsätzlich würde ich gerne wissen, ob der Benutzer auf diese markierte Auswahl geklickt hat.Gibt es eine Möglichkeit, den onclick eines Elements, das sich hinter einem anderen Element in JavaScript befindet, auszulösen?

Jedoch. Das Hervorhebungs-Div steht hinter dem Text, daher scheint die Onclick-Methode für das Div nicht aufgerufen zu werden. Gibt es da einen Trick um das zu umgehen?

Danke, Grae


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html> 
    <head> 
     <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" > 
    </head> 
    <body> 
     <div style="position: relative"> 
      <div style="width:200px;height:200px;background-color: seagreen; position: absolute; left: 40px; top: 40px; z-index: -1" onclick="alert('called?')"></div> 
      <pre > 
This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test! 
This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test! 
This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test! 
This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test! 
This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test! 
This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test! 
This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test! 
This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test! 
This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test! 
This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test! 
This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test! 
This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test! 
This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test! 
This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test! 
This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test! 
This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test! 
This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test! 
This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test! 
This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test! 
This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test! 
This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test! 
This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test! 
This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test! 
This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test!This is a test! 

      </pre> 
     </div> 
    </body> 
</html> 
+1

Benötigen Sie wirklich diesen ganzen wiederholten Text für Demozwecke? –

+0

Nein, wahrscheinlich nicht. –

+0

Lesenswert: http://www.quirksmode.org/js/events_order.html –

Antwort

0

Sie auf diese Weise tun könnte:

auf dem Höhepunkt div Sie

z-index:1; 
opacity:0.2; /* from 0 to 1*/ 
filter:alpha(opacity=20); /* IE opacity fix */ 

setzen könnten Sie haben Opazität zu setzen, wenn Sie die zeigen wollen Highlight div und auf der Rückseite der Text

Beispiel hier: http://jsfiddle.net/steweb/Cqvve/

+0

Gute Idee. Ich denke, das wird funktionieren. –

Verwandte Themen