Permalink
Browse files

Added preDelay option to dropdownize

  • Loading branch information...
halilim committed Dec 15, 2011
1 parent 09d752a commit ee0f17631c3d67a55726d9f51051ccdfdcb95ad5
Showing with 79 additions and 66 deletions.
  1. +79 −66 javascript/dropdownize.js
View
@@ -1,67 +1,80 @@
-/**
- * Make drop downs with a few options.
- *
- * <div class="ddzContainer" style="position: relative;">
- * <a href="#" class="ddzOpener">Aha</a>
- * <div class="ddzMenu">Lorem ipsum dolor sit <br />amet consectetuer<br /></div>
- * </div>
- *
- * $(".ddzOpener")
- * .dropdownize({menuEl: ".ddzMenu"})
- * .click(function (){ return false; });
- *
- * Useful CSS:
- * .ddzContainer{position: relative;}
- * .ddzMenu{position: absolute;width: 150px;top: 0; display:none;background-color: #eee;}
- */
-;(function($){
- $.fn.dropdownize = function(options) {
- var defaults = {
- hideAfter: 400,
- showOn: "mouseenter",
- showFn: function (){
- $(this).slideDown("fast");
- },
- hideFn: function (){
- $(this).slideUp("fast");
- }
- };
- var o = $.extend(true, {}, defaults, options);
- return this.each(function() {
- var $this = $(this);
- var menuElem;
- if ($.isFunction(o.menuEl)) {
- menuElem = o.menuEl.call($this);
- } else {
- menuElem = $(o.menuEl);
- }
- var ddzTOId = 0;
- function ddzHide(){
- o.hideFn.call(menuElem);
- $this.removeClass("hover");
- ddzTOId = 0;
- }
- function ddzSetHide(){
- ddzTOId = setTimeout(ddzHide, o.hideAfter);
- }
- function ddzClrTO()
- {
- if (ddzTOId != 0) {
- clearTimeout(ddzTOId);
- ddzTOId = 0;
- }
- }
- $this.bind(o.showOn + ".dropdownize", function (){
- o.showFn.call(menuElem);
- $(this).addClass("hover");
- });
- $this.add(menuElem)
- .bind("mouseleave.dropdownize", function (){
- ddzSetHide();
- })
- .bind("mouseenter.dropdownize", function (){
- ddzClrTO();
- });
- });
- };
+/**
+ * Make drop downs with a few options.
+ *
+ * <div class="ddzContainer" style="position: relative;">
+ * <a href="#" class="ddzOpener">Aha</a>
+ * <div class="ddzMenu">Lorem ipsum dolor sit <br />amet consectetuer<br /></div>
+ * </div>
+ *
+ * $(".ddzOpener")
+ * .dropdownize({menuEl: ".ddzMenu"})
+ * .click(function (){ return false; });
+ *
+ * Useful CSS:
+ * .ddzContainer{position: relative;}
+ * .ddzMenu{position: absolute;width: 150px;top: 0; display:none;background-color: #eee;}
+ */
+;(function($){
+ $.fn.dropdownize = function(options) {
+ var defaults = {
+ preDelay: 0,
+ hideAfter: 400,
+ showOn: "mouseenter",
+ showFn: function (){
+ $(this).slideDown("fast");
+ },
+ hideFn: function (){
+ $(this).slideUp("fast");
+ }
+ };
+ var o = $.extend(true, {}, defaults, options);
+ return this.each(function() {
+ var $this = $(this);
+ var menuElem;
+ if ($.isFunction(o.menuEl)) {
+ menuElem = o.menuEl.call($this);
+ } else {
+ menuElem = $(o.menuEl);
+ }
+ var ddzTOId = 0;
+ function ddzShow(){
+ o.showFn.call(menuElem);
+ $this.addClass("hover");
+ }
+ function ddzHide(){
+ o.hideFn.call(menuElem);
+ $this.removeClass("hover");
+ ddzTOId = 0;
+ }
+ function ddzSetHide(){
+ ddzTOId = setTimeout(ddzHide, o.hideAfter);
+ }
+ function ddzClrTO()
+ {
+ if (ddzTOId != 0) {
+ clearTimeout(ddzTOId);
+ ddzTOId = 0;
+ }
+ }
+ $this.bind(o.showOn + ".dropdownize", function (){
+ if (o.preDelay) {
+ $this.data("ddz.htId", setTimeout(function (){
+ ddzShow();
+ }, o.preDelay));
+ } else {
+ ddzShow();
+ }
+ });
+ $this.add(menuElem)
+ .bind("mouseleave.dropdownize", function (){
+ ddzSetHide();
+ if ($this.data("ddz.htId")) {
+ clearTimeout($this.data("ddz.htId"));
+ }
+ })
+ .bind("mouseenter.dropdownize", function (){
+ ddzClrTO();
+ });
+ });
+ };
})(jQuery);

0 comments on commit ee0f176

Please sign in to comment.