nice menu mobile gesture

Question

i've developed a project using Nice Menus module, but on mobile can't use well with submenus. So i thought to use JS injector to listen swipe on screen and make menu visible. i wrote this code

$(document).ready(function(){$("#second-column").on("swipe",function(){
      if($(window).width()<=900)
        $("#nice-menu-1>li>ul").css("display: block; visibility: visible;");
  });
});

but chrome console said $ is not a function so i search and replace $ with jQuery, now i've no moar message but it doesn't work.

Thanks in advance for help

Answer 1

I think this is a syntax issue. Try using

jQuery(function($) {
    //Your Code
});

Answer 2

I'm taking a stab at this and guessing you are using D7, refer to the page I link below for D6/D8 versions of the behavior code below.

The correct way to use JS in Drupal is to wrap your code in a Drupal behavior.

(function ($) {
   Drupal.behaviors.myModuleBehavior = {
    attach: function (context, settings) {
      $('input.myCustomBehavior', context).once('myCustomBehavior', function () {
        // Apply the myCustomBehaviour effect to the elements only once.
      });
    }
  };
})(jQuery);

You can read more about that here: https://www.drupal.org/node/304258

Now that being said, technically swapping out for jQuery should have worked also but you should at least get some errors if the code is ran. Maybe swapping over to a behavior will let it continue through and finish running.

Answer 3

If statement in jQuery example:

if (n < 2) {
        $("body").css("background", "green");
    } 

I noticed your if statement is missing curly brackets { } so try

(function ($) {

  $(document).ready(function() {
     $("#second-column").on("swipe",function(){
           if($(window).width()<=900) {
           $("#nice-menu-1>li>ul").css("display: block; visibility: visible;"); 
           }           
        });
    });

})(jQuery);

Answer 4

I discover what was the problem it's jQuery.
Drupal core run 1.4 but to use mobile gesture i need 1.7. After i've update to it my mobile menu works but all website functionality will broke because js is incompactible.

Now, i've search a lot and the best result i've found is this discussion so i've install jQuery multi but nothing change my site is broke. In particular i've a big problem, when i try to open a page it will not opened but the URL change and the page is printed at the bottom to the previous. So i need to refresh manually to get my page

Could someone adress me to the right way?