focustracker.html 715 B

123456789101112131415161718192021222324252627282930313233343536373839404142
  1. <head>
  2. <meta charset="utf-8">
  3. <style>
  4. div[contenteditable],
  5. div[tabindex] {
  6. padding: 10px;
  7. border: solid 1px #888;
  8. }
  9. span {
  10. padding-left: 10px;
  11. }
  12. .status {
  13. font-weight: normal;
  14. }
  15. </style>
  16. </head>
  17. <h2 class="status">Status <span>focus: <b>0</b></span> <span>blur: <b>0</b></span></h2>
  18. <hr>
  19. <h2>Tracked by Focus Tracker:</h2>
  20. <h3>Input:</h3>
  21. <input type="text" class="track">
  22. <h3>Content editable:</h3>
  23. <div contenteditable="true" class="track">Some editable content</div>
  24. <h3>HTML Wrapper (uses event capturing):</h3>
  25. <div tabindex="-1" class="track">
  26. <input type="text">
  27. <input type="text">
  28. </div>
  29. <h2>Not tracked by Focus Tracker:</h2>
  30. <h3>Input:</h3>
  31. <input type="text">