Pastebin launched a little side project called VERYVIRAL.com, check it out ;-) Want more features on Pastebin? Sign Up, it's FREE!

FlexNav modification for WordPress

By: dariodev on May 28th, 2013  |  syntax: JavaScript  |  size: 3.36 KB  |  views: 1,089  |  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. (function($) {
  2.  
  3.   $.fn.flexNav = function(options) {
  4.     var $nav, breakpoint, isDragging, nav_open, resizer, settings;
  5.     settings = $.extend({
  6.       'animationSpeed': 100
  7.     }, options);
  8.     $nav = $(this);
  9.     nav_open = false;
  10.     isDragging = false;
  11.     $nav.find("li").each(function() {
  12.       if ($(this).has("ul").length) {
  13.         return $(this).addClass("item-with-ul").find("ul").hide();
  14.       }
  15.     });
  16.     if ($nav.data('breakpoint')) {
  17.       breakpoint = $nav.data('breakpoint');
  18.     }
  19.     resizer = function() {
  20.       if ($(window).width() <= breakpoint) {
  21.         $nav.removeClass("lg-screen").addClass("sm-screen");
  22.         $('.one-page li a').on('click', function() {
  23.           return $nav.removeClass('show');
  24.         });
  25.         return $('.item-with-ul').off();
  26.       } else {
  27.         $nav.removeClass("sm-screen").addClass("lg-screen");
  28.         $nav.removeClass('show');
  29.         return $('.item-with-ul').on('mouseenter', function() {
  30.           return $(this).find('>ul').addClass('show').stop(true, true).slideDown(settings.animationSpeed);
  31.         }).on('mouseleave', function() {
  32.           return $(this).find('>ul').removeClass('show').stop(true, true).slideUp(settings.animationSpeed);
  33.         });
  34.       }
  35.     };
  36.     $('.item-with-ul, .menu-button').append('<span class="touch-button"><i class="navicon">&#9660;</i></span>');
  37.     $('.menu-button, .menu-button .touch-button').on('touchstart mousedown', function(e) {
  38.       e.preventDefault();
  39.       e.stopPropagation();
  40.       console.log(isDragging);
  41.       return $(this).on('touchmove mousemove', function(e) {
  42.         var msg;
  43.         msg = e.pageX;
  44.         isDragging = true;
  45.         return $(window).off("touchmove mousemove");
  46.       });
  47.     }).on('touchend mouseup', function(e) {
  48.       var $parent;
  49.       e.preventDefault();
  50.       e.stopPropagation();
  51.       isDragging = false;
  52.       $parent = $(this).parent();
  53.       if (isDragging === false) {
  54.         console.log('clicked');
  55.       }
  56.       if (nav_open === false) {
  57.         $nav.addClass('show');
  58.         return nav_open = true;
  59.       } else if (nav_open === true) {
  60.         $nav.removeClass('show');
  61.         return nav_open = false;
  62.       }
  63.     });
  64.     $('.touch-button').on('touchstart mousedown', function(e) {
  65.       e.stopPropagation();
  66.       e.preventDefault();
  67.       return $(this).on('touchmove mousemove', function(e) {
  68.         isDragging = true;
  69.         return $(window).off("touchmove mousemove");
  70.       });
  71.     }).on('touchend mouseup', function(e) {
  72.       var $sub;
  73.       e.preventDefault();
  74.       e.stopPropagation();
  75.       $sub = $(this).parent('.item-with-ul').find('>ul');
  76.       if ($nav.hasClass('lg-screen') === true) {
  77.         $(this).parent('.item-with-ul').siblings().find('ul.show').removeClass('show').hide();
  78.       }
  79.       if ($sub.hasClass('show') === true) {
  80.         return $sub.removeClass('show').slideUp(settings.animationSpeed);
  81.       } else if ($sub.hasClass('show') === false) {
  82.         return $sub.addClass('show').slideDown(settings.animationSpeed);
  83.       }
  84.     });
  85.     $('.item-with-ul *').focus(function() {
  86.       $(this).parent('.item-with-ul').parent().find(".open").not(this).removeClass("open").hide();
  87.       return $(this).parent('.item-with-ul').find('>ul').addClass("open").show();
  88.     });
  89.     resizer();
  90.     return $(window).on('resize', resizer);
  91.   };
  92.  
  93. })(jQuery);