Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
  • #455156

    I am working on a child theme of Enfold which you can see at this address.

    I am looking to change the transition used in the main navigation menu where items are defined as buttons. I can’t find the source of the transition, I have tried changing the CSS but to no avail. As you can see I added a small ticker to the sub-menu and I want them both to fade in and out at the same speed.



    Hi Technoh!

    Thank you for using Enfold.

    What do you mean by transition? Are you trying to change the hover effect? A screenshot will help.



    Hi Ismael,

    Yes, I am trying to change the hover effect. I want to control how fast it shows the sub-menu (ease-in) and how fast it reverts to showing nothing (ease-out). Here are screenshots to demonstrate what I want to control:


    Is this controlled in Javascript or CSS? If so, which file and which line?




    You can modify the mouse over transition on js > avia.js, look for this code around line 1202:

    sublist.stop().css({visibility:'visible'}).animate({opacity:1}, 5000);

    Adjust animate duration:


    For the mouseleave event, edit the code below:

    sublist.stop().animate({opacity:0}, 5000, function()

    Replace it with:

    sublist.stop().animate({opacity:0}, function()

    Adjust the value as you please.


Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.