2

I'm using Superfish v1.7.4. I need to disable Superfish menu effects in mobile resolution. Here is my code.

<ul class="nav">
    <li><a href="index.html">Home</a></li>
    <li><a href="about.html">About</a></li>
    <li class="dropdown">
        <a href="#">Pages</a>
        <ul class="dropdown-menu">
            <li><a href="about-us.html">About Us</a></li>
            <li><a href="about-me.html">About Me</a></li>
            <li><a href="services.html">Services</a></li>
        </ul>
    </li>
    <li><a href="contact.html">Contact</a></li>
</ul>
$(document).ready(function() {
    var $this = this;
    $this.checkSuperfish = function() {
        if ($(window).width() >= 768) {
            $('ul.nav').addClass('sf-menu');
            $('.sf-menu').superfish({
                animation: { height: 'show' },
                delay: 500,
                hoverClass: 'open',
                speed: 'fast', 
            });
        }
        else {
            $('ul.nav').removeClass('sf-menu');
            $('ul.nav li').unbind();
            $('ul.nav li ul').removeAttr('style');
            $('.sf-menu').superfish({
                animation: { height: 'show' },
                delay: 500,
                speed: 'fast', 
            });
        }
    }

    $(window).on("resize", function() {
        $this.checkSuperfish();
    });

    $this.checkSuperfish();
});

In here I have a little issue. When the low resolution, the menu is still opening in the mousehover event. I want to disable menu opening effect. Is this possible. Thank you.

Rory McCrossan
  • 331,213
  • 40
  • 305
  • 339
Sasindu H
  • 1,538
  • 7
  • 24
  • 43

0 Answers0