oplysninger om muse-events

Der er (desværre !-) _meget_ stor forskel på event-objekter og deres opførsel i IE og Gecko-browsere ...

For det første er event ikke et generisk objekt i Mozilla m.m., men en tilføjet parameter, så du skal i dine kald og funktioner gøre sådan:

showMe('tip',event)

function showMe(elm,e){

-- og så bruge e i stedet for event

For det andet er der en hulens masse properties og virkemåder som er forskellige, dog ikke lige på clientX/Y-tingen, så den er ret nem !o]

<ole>

Gecko og IE har helt forskellig implementering af events. Prøv:

<script type="text/JavaScript">
function bla(e) {
    alert(e.clientY);
}
window.onload = function() {
    document.getElementById("ib").onclick = bla;
}
</script>

<br><br><br><br><br><br><br><br><br><br>

<div id="ib">TEST</div>

/mvh
</bole>

... eller:

<script type="text/JavaScript">
function bla(e) {
    alert(e.clientY);
}
</script>

<br><br><br><br><br><br><br><br><br><br>

<div id="ib" onclick="bla(event)">TEST</div>

ok, så den løsning du havde i det andet sp. var en ren IE-ting? (Det tænkte jeg også, fordi han også brugte scrollLeft og scrollTop som kun er IE, ikke?).

ok, så det ER pga forskelle i browserne - igenigen...
det tumler vi videre med i morgen, nu er det gonat folkens ;-)

Jo !-)

Og en crossbrowser-udgave af oles eksempel kunne være:

<script type="text/JavaScript">
function bla(e) {
    if(navigator.userAgent.indexOf('MSIE')>-1)e=event;
    alert(e.clientY);
}
window.onload = function() {
    document.getElementById("ib").onclick = bla;
}
</script>

<br><br><br><br><br><br><br><br><br><br>

<div id="ib">TEST</div>

Forskellen er at window.Event i Gecko er en prototype-constructor, hvor window.event i IE er et object ... eller rettere en instans af et object

Eller bare:
  if (window.event) e=window.event;  ;o)

Den sidste kommentar var en anden version af roenvings:
  if(navigator.userAgent.indexOf('MSIE')>-1)e=event;

-- så kan du måske lige opdatere på hvor Opera og nogle af de andre browsere er henne i det spil (mac-tingene og f.eks. konqueror ?-)

'Konkylien' ved jeg ikke - men Opera æder vist begge event-modeller  :)

Oki, tak !-)

gomorgen, folkens!
Har nu prøvet at gå videre med mit lille tootip script efter jeres model her og er nu nået frem til flg. der dur i både IE og Gecko:

<script type="text/javascript"><!--
function showMe(e){
  if(window.event) var e = event;
  var s = document.getElementById('tip').style;
  s.display='inline';
  s.top = e.clientY + 16 + 'px';
  s.left= e.clientX + 16 + 'px';
}
window.onload = function(){
  document.getElementById('link').onmouseover = showMe;
}
 
function hideMe(elm){
  document.getElementById(elm).style.display = 'none';
}
//--></script>

<a id="link" href="#" onmouseout="hideMe('tip');">Tooltip link</a>

Men det er jo ikke så praktisk når ID'erne ('tip' og 'link') er angivet i funktionen. Det er bare ikke lige til at se hvordan jeg får dem erstattet af nogle variabel parametre der kan kaldes i funktionen, når denne nu er gjort anonym, for så er der jo ikke noget funktionskald hvor jeg kan indsætte de konkrete ID'er.

Og så lige et generelt sp. til oles script:

function bla(e) {
    alert(e.clientY);
}
window.onload = function() {
    document.getElementById("ib").onclick = bla;
}

- ja, det ofte i forbindelse med events man ser denne konstruktion med en anonym funktion. Hvad er meningen med den konstruktion? Hvorfor bruger man den? Hvad er fidusen ved den?
//

og kan selvfølgelig lige strammes yderligere op:

<script type="text/javascript"><!--
function showMe(e){
  if(window.event) var e = event;
  var s = document.getElementById('tip').style;
  s.display='inline';
  s.top = e.clientY + 16 + 'px';
  s.left= e.clientX + 16 + 'px';
}

function hideMe(){
  document.getElementById('tip').style.display='none';
}

window.onload = function(){
  document.getElementById('link').onmouseover = showMe;
  document.getElementById('link').onmouseout = hideMe;
}
 
//--></script>

<a id="link" href="#">Tooltip link</a>

men stadig, hvorfor egentlig denne konstruktion?

Du kunne f.eks. også skrive:

function bla(e) {
    alert(e.clientY);
}
function myLoad() {
    document.getElementById("ib").onclick = bla;
}
window.onload = myLoad;

Det andet er bare slankere  :)

Nu har jeg gjort tooltip funktionen generisk:

<script type="text/javascript">
function show(e,txt){
  if(window.event) var e = event; // for IE
  var t = document.getElementById('tip');
  t.innerHTML=txt;
  t.style.display='inline';
  t.style.top = e.clientY + 16 + 'px';
  t.style.left= e.clientX + 16 + 'px';
 
}

function hide(){
  document.getElementById('tip').style.display='none';
}
</script>

<a href="#" onmouseover="show(event,'Her du!');" onmouseout="hide();">Tooltip link</a>

Det er vel også den slankeste udgave det kan blive til, ikke? Eller kan man gøre noget à la oles anonyme funktion? Men hvordan får man så teksten ind, som jo vil være forskellig fra link til link?

Anyway, læg svar! og tak for hjælpen begge
//mik

Hvis du vil anonymisere kan du bruge en global variabel, men det slanker vel ikke ?-)

var txt;
function show(){
...

<a href="#" onmouseover="txt='Her du!';show();" onmouseout="hide();">Tooltip link</a>

-- bare så du kan se ideen !-)

-- og ellers velbekomme '-)

;o)

-- og tak for points ;~}