Server IP : 85.214.239.14 / Your IP : 52.15.70.0 Web Server : Apache/2.4.62 (Debian) System : Linux h2886529.stratoserver.net 4.9.0 #1 SMP Tue Jan 9 19:45:01 MSK 2024 x86_64 User : www-data ( 33) PHP Version : 7.4.18 Disable Function : pcntl_alarm,pcntl_fork,pcntl_waitpid,pcntl_wait,pcntl_wifexited,pcntl_wifstopped,pcntl_wifsignaled,pcntl_wifcontinued,pcntl_wexitstatus,pcntl_wtermsig,pcntl_wstopsig,pcntl_signal,pcntl_signal_get_handler,pcntl_signal_dispatch,pcntl_get_last_error,pcntl_strerror,pcntl_sigprocmask,pcntl_sigwaitinfo,pcntl_sigtimedwait,pcntl_exec,pcntl_getpriority,pcntl_setpriority,pcntl_async_signals,pcntl_unshare, MySQL : OFF | cURL : OFF | WGET : ON | Perl : ON | Python : ON | Sudo : ON | Pkexec : OFF Directory : /srv/modoboa/instance/sitestatic/jquery/test/ |
Upload File : |
<html> <head> <title>Hover tests</title> <script src="../dist/jquery.min.js"></script> <style> /* Remove body dimensions so we can test enter/leave to surrounding browser chrome */ body, html { border: 0; margin: 0; padding: 0; } p { margin: 2px 0; } .hover-box { background: #f33; padding: 3px; margin: 10px 40px 20px 0; } .hover-status { background: #f66; padding: 1px; } .hover-inside { background: #6f6; padding: 1px; margin: 8px auto; width: 40%; text-align: center; } </style> </head> <body> <h2>Hover (mouse{over,out,enter,leave}) Tests</h2> <p>Be sure to try moving the mouse out of the browser via the left side on each test.</p> <div id="wrapper"> <div id="hoverbox" class="hover-box"> <div class="hover-status"> <button>Activate</button> .hover() in/out: <span class="ins">0</span> / <span class="outs">0</span> </div> <div class="hover-inside"> Mouse over here should NOT trigger the counter. </div> </div> <div id="liveenterbox" class="hover-box"> <div class="hover-status"> <button>Activate</button> Live enter/leave: <span class="ins">0</span> / <span class="outs">0</span> </div> <div class="hover-inside"> Mouse over here should NOT trigger the counter. </div> </div> <div id="delegateenterbox" class="hover-box"> <div class="hover-status"> <button>Activate</button> Delegated enter/leave: <span class="ins">0</span> / <span class="outs">0</span> </div> <div class="hover-inside"> Mouse over here should NOT trigger the counter. </div> </div> <div id="overbox" class="hover-box"> <div class="hover-status"> <button>Activate</button> Bind over/out: <span class="ins">0</span> / <span class="outs">0</span> </div> <div class="hover-inside"> Mouse over here SHOULD trigger the counter. </div> </div> <div id="liveoverbox" class="hover-box"> <div class="hover-status"> <button>Activate</button> Live over/out: <span class="ins">0</span> / <span class="outs">0</span> </div> <div class="hover-inside"> Mouse over here SHOULD trigger the counter. </div> </div> <div id="delegateoverbox" class="hover-box"> <div class="hover-status"> <button>Activate</button> Delegated over/out: <span class="ins">0</span> / <span class="outs">0</span> </div> <div class="hover-inside"> Mouse over here SHOULD trigger the counter. </div> </div> </div> <!-- wrapper --> <script> $(function(){ var x, countIns = function() { var d = $(this).data(); $("span.ins", this).text(++d.ins); }, countOuts = function() { var d = $(this).data(); $("span.outs", this).text(++d.outs); }; // Tests can be activated separately or in combination to check for interference $("#hoverbox button").click(function(){ $("#hoverbox") .data({ ins: 0, outs: 0 }) .hover( countIns, countOuts ); $(this).remove(); }); $("#delegateenterbox button").click(function(){ $("html") .find("#delegateenterbox").data({ ins: 0, outs: 0 }).end() .delegate("#delegateenterbox", "mouseenter", countIns ) .delegate("#delegateenterbox", "mouseleave", countOuts ); $(this).remove(); }); $("#liveenterbox button").click(function(){ $("#liveenterbox") .data({ ins: 0, outs: 0 }) .live("mouseenter", countIns ) .live("mouseleave", countOuts ); $(this).remove(); }); $("#overbox button").click(function(){ $("#overbox") .data({ ins: 0, outs: 0 }) .bind("mouseover", countIns ) .bind("mouseout", countOuts ); $(this).remove(); }); $("#liveoverbox button").click(function(){ $("#liveoverbox") .data({ ins: 0, outs: 0 }) .live("mouseover", countIns ) .live("mouseout", countOuts ); $(this).remove(); }); $("#delegateoverbox button").click(function(){ $(document) .find("#delegateoverbox").data({ ins: 0, outs: 0 }).end() .delegate("#delegateoverbox", "mouseover", countIns ) .delegate("#delegateoverbox", "mouseout", countOuts ); $(this).remove(); }); }); </script> </body> </html>