Forums

This topic is locked

Loading menus in with AJAX and stopping flicker

Posted 22 Mar 2013 17:21:02
1
has voted
22 Mar 2013 17:21:02 Jim Elliott posted:
This is a trick I use which I hope could be useful.

The scenario is that the menu is loaded into a div via an jquery AJAX call. I use this as it means in a complex site the menu is only in one place and changes can be easily made just once.

so on the document.ready() I load in the menu with something live:

$('#menudiv').load('menupage.php');

ie load the menu which is located on the page menupage into a div called menu div.

This will cause the menu to initially display with everything open, then the graphics will appear and then it will show properly.

Not too pretty at all.

Here is a simple solution on the document ready:

$('#menudiv').hide();
$('#menudiv').load('menupage.php',function() {
$('#menudiv').show();
});

when the loading has finished the call back from the load will show the div - all ready and nice.

Hope it is useful!

Reply to this topic