Don't like ads? PRO users don't see any ads ;-)
Guest

Untitled

By: a guest on May 4th, 2012  |  syntax: None  |  size: 1.73 KB  |  hits: 12  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. Close a customized box at ESC keypress with JQuery
  2. <div id="modal-dialog" class="no-display">
  3.         <div class="form">
  4.             <div class="close">
  5.  
  6.             </div>
  7.             <div align="center">
  8.                 <h2><u>form</u></h2>
  9.             </div>          
  10.             <form>
  11.                 <label for="yourname">Full name:</label><input type="text" name="yourname">
  12.                 <label for="email">E-mail:</label><input type="text" name="email">
  13.                 <label for="message">Message:</label></textarea><textarea type="text" name="message"></textarea><br/>
  14.                 <div class="clear"></div>
  15.                 <p align="center"><button>Send feedback</button></p>
  16.             </form>
  17.         </div>
  18.     </div>
  19.        
  20. $("#clickfeed").live("click", function() {
  21.         $("#modal-dialog").removeClass("no-display");
  22.     });
  23.        
  24. $("#modal-dialog").live("keyup", function(e) {
  25.         if(e.keyCode === 27 && !($(this).hasClass("no-display")))
  26.         {
  27.             $("#feedback-modal-dialog input").each(function() {
  28.                 $(this).attr("value","");
  29.             });
  30.             $("#feedback-modal-dialog textarea").each(function() {
  31.                 $(this).val("");
  32.             });
  33.             $("#modal-dialog").addClass("no-display"); //or .hide()
  34.         }      
  35.     });
  36.        
  37. $("html").live("keyup", function(e) {
  38.  
  39. if(e.keyCode === 27 && !($('#modal-dialog').hasClass("no-display")))
  40.  
  41.     escape_check();
  42.  
  43. }
  44.  
  45. }
  46.  
  47. function escape_check() {
  48.  
  49. $("#modal-dialog").removeClass("no-display");
  50.  
  51. $("#feedback-modal-dialog input").each(function() {
  52.     $('#modal-dialog').attr("value","");
  53. });
  54. $("#feedback-modal-dialog textarea").each(function() {
  55.     $('#modal-dialog').val("");
  56. });
  57. $("#modal-dialog").addClass("no-display"); //or .hide()
  58.  
  59.  
  60. }