CODEWITHSUNDEEP
javascriptjqueryhtml
Lucaz Nunes
Lucaz Nunes

Reputation: 35

Show a sub-menu using JQuery

I need some help making a sub-menu appear within 2s after the page loads instead of when the user clicks on it. I'm using JQuery. That file is the core of the website. I need it to stay opened.

Here's the code I have at the moment, I tried to change that on.Click event but it didn't work.

The handleSidenarAndContentHeight(); function resizes the menu items after the sub-menu appears.

jQuery('.page-sidebar li > a').on('click', function (e) {
    if ($(this).next().hasClass('sub-menu') === false) {
        return;
    }
    var parent = $(this).parent().parent();
    parent.children('li.open').children('a').children('.arrow').removeClass('open');
    parent.children('li.open').children('a').children('.arrow').removeClass('active');
    parent.children('li.open').children('.sub-menu').slideUp(350);
    parent.children('li').removeClass('open');
    parent.children('li').removeClass('active');

    var sub = jQuery(this).next();
    if (sub.is(":visible")) {
        jQuery('.arrow', jQuery(this)).removeClass("open");
        jQuery(this).parent().removeClass("active");
        sub.slideUp(350, function () {
            handleSidenarAndContentHeight();
        });
    } else {
        jQuery('.arrow', jQuery(this)).addClass("open");
        jQuery(this).parent().addClass("open");
        sub.slideDown(350, function () {
            handleSidenarAndContentHeight();
        });
    }

    e.preventDefault();
});

Upvotes: 0

Views: 61

Answers (2)

Niku Hysa
Niku Hysa

Reputation: 76

There is a simple javascript function you can use, the setTimeout function.

The code follows like this : 

setTimeout(function() {yourFunctyion();}. delayTimeInMiliseconds);

This will call your function after the number of second(in ms).

There is also a plugin I've used. It has oneTime and everyTime methods.

jQuery timers plugin

Upvotes: 1

coderocket
coderocket

Reputation: 584

Working with a 2 second timeout should do the trick!

jQuery(document).ready(function(){
  // Open Parent here

  setTimeout(function(){
    // Open Child here
  }, 2000)
});

Upvotes: 3

Related Questions