Scrolling effect lost when adding sub-items to the menu

Hello, I'm working on the following website http://www.wagtailgraphics.com.au/uat/

I've added sub-items to the item Products on the menu. It actually goes to the where it should go, but the nice scrolling effect is not working. Notice that the effect works nicely on the other 2 menu options: Home and Contact Us.

I've tried removing the sub-items and it works fine without them. The effect is lost only by the items with sub-items.

Thanks in advance

Hello,

Scrolling effect is visible only for links with anchor tag - e.g. #contact which are placed in the same page (on the homepage), so it's not possible to have this effect with your links from the sub menu. You can add other widget into your homepage and then try to assign links with these areas.

Thanks for the info
Maybe I wasn't clear enough.
"Products" is a top level menu item.
The scrolling effect goes on "Products" which has the anchor tag #printing-services, (and yes, it stays at home page) It works fine when it doesn't have sub-items.
If sub-items are added (linking to other pages, it doesn't matter as "Products" is still going to #printing-services) the scrolling effect on "Products" stops working.

To make it easier to understand I've added a copy of "Products" called "Products without sub-items". But I haven't created any sub-items under it.
Don't forget my site is at http://www.wagtailgraphics.com.au/uat/

Ok, now I understand where exactly the problem is. Please try to replace John/js/gk.menu.js file with the attachment. Remember about the backup!

Thanks a lot!
It works