当前位置: 代码迷 >> JavaScript >> Javascript擒获鼠标位置(跨浏览器)
  详细解决方案

Javascript擒获鼠标位置(跨浏览器)

热度:183   发布时间:2012-11-16 14:12:14.0
Javascript捕获鼠标位置(跨浏览器)
Html代码
  1. Javascript获取鼠标位置,显示Memo,相当于Alt和Title属性,但是要比Alt和Title拉风啊??
  2. ??
  3. ??
  4. < html > ??
  5. ????< head > ??
  6. ????????< script ? type = "text/javascript" > ??
  7. ????????????function?showMemo(evt,data)?{??
  8. ????????????????//alert(evt.clientX);??
  9. ????????????????document.getElementById.('memo').style.left ?=? evt .clientX;??
  10. ????????????????document.getElementById.('memo').style.top ?=? evt .clientY;??
  11. ????????????????document.getElementById.('memo').innerHTML ?=? data ;??
  12. ????????????????document.getElementById.('memo').style.display ?=? 'block' ;??
  13. ????????????}??
  14. ????????????function?hideMemo()?{??
  15. ????????????????document.getElementById.('memo').style.display ?=? 'none' ;??
  16. ????????????}??
  17. ????????</ script > ??
  18. ????</ head > ??
  19. ????< body > ??
  20. ????????< table > ??
  21. ????????????< tr > ??
  22. ????????????????< td ? onmouseover ="showMemo(event,'Memo1');" onmouseout ="hideMemo();" > aaa </ td > ??
  23. ????????????????< td ? onmouseover ="showMemo(event,'大家好,我是Memo2!!!');" onmouseout ="hideMemo();" > aaa </ td > ??
  24. ????????????????< td ? onmouseover ="showMemo(event,'大家好,我是Memo3!!!');" onmouseout ="hideMemo();" > aaa </ td > ??
  25. ????????????????< td ? onmouseover ="showMemo(event,'大家好,我是Memo4!!!');" onmouseout ="hideMemo();" > aaa </ td > ??
  26. ????????????????< td ? onmouseover ="showMemo(event,'大家好,我是Memo5!!!');" onmouseout ="hideMemo();" > aaa </ td > ??
  27. ????????????????< td ? onmouseover ="showMemo(event,'aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa');" onmouseout ="hideMemo();" > aaa </ td > ??
  28. ????????????</ tr > ??
  29. ????????????< tr > ??
  30. ????????????????< td > bbb </ td > ??
  31. ????????????????< td > bbb </ td > ??
  32. ????????????????< td > bbb </ td > ??
  33. ????????????????< td > bbb </ td > ??
  34. ????????????????< td > bbb </ td > ??
  35. ????????????????< td > bbb </ td > ??
  36. ????????????</ tr > ??
  37. ????????????< tr > ??
  38. ????????????????< td > ccc </ td > ??
  39. ????????????????< td > ccc </ td > ??
  40. ????????????????< td > ccc </ td > ??
  41. ????????????????< td > ccc </ td > ??
  42. ????????????????< td > ccc </ td > ??
  43. ????????????????< td > ccc </ td > ??
  44. ????????????</ tr > ??
  45. ????????</ table > ??
  46. ????????< div ? id = "memo" ? style = "position:absolute;border:1px?solid?blue;background:yellow;width:100px;display:none;word-wrap:break-word" > ddd </ div > ??
  47. ????</ body > ??
  48. </ html > ?
  相关解决方案