| <html> |
| <head> |
| <style> |
| @font-face { |
| font-family:ahem-3sec; |
| src: url(slow-ahem-loading.cgi?delay=3000); |
| } |
| @font-face { |
| font-family:ahem-8sec; |
| src: url(slow-ahem-loading.cgi?delay=8000); |
| } |
| @font-face { |
| font-family:ahem-5sec; |
| src: url(slow-ahem-loading.cgi?delay=5000); |
| } |
| .testspan { |
| font-size:64px; |
| border: 1px solid; |
| } |
| #span1 { |
| font-family: ahem-3sec, Arial; |
| } |
| #span2 { |
| font-family: ahem-8sec, Arial; |
| } |
| #span3 { |
| font-family: ahem-5sec, Arial; |
| } |
| </style> |
| </head> |
| <body> |
| |
| Ahem after 4 seconds: |
| <br/> |
| <span class="testspan" id="span1" style="display: none;"> |
| abcdefg |
| </span> |
| <br/> |
| |
| Arial after 4 seconds: |
| <br/> |
| <span class="testspan" id="span2" style="display: none;"> |
| abcdefg |
| </span> |
| <br/> |
| |
| Arial after hidden for 3 seconds and revealed for 1 second: |
| <br/> |
| <span class="testspan" id="span3" style="display: none;"> |
| abcdefg |
| </span> |
| <br/> |
| |
| <script> |
| |
| if (window.testRunner) |
| testRunner.waitUntilDone(); |
| |
| function displayElementAfter(id, msec) { |
| setTimeout(function() { |
| document.getElementById(id).style.removeProperty("display"); |
| }, msec); |
| } |
| |
| window.onload = function() { |
| displayElementAfter("span1", 0); |
| displayElementAfter("span2", 0); |
| displayElementAfter("span3", 3000); |
| setTimeout(function() { if (window.testRunner) testRunner.notifyDone(); }, 4000); |
| }; |
| |
| </script> |
| </body> |
| </html> |
