artberri / sidr

Sidr is a jQuery plugin for creating side menus and the easiest way for doing your menu responsive.
http://www.berriart.com/sidr/
MIT License
2.89k stars 595 forks source link

Sidr Flash on load OR does not open #304

Open mdmoura opened 8 years ago

mdmoura commented 8 years ago

I had Sidr 1.2.1 working on a web site and I updated it to 2.2.1 ...

With this change Sidr does now show anymore ... I then removed "display: none;" from the Sidr containing DIV and it works but it flashes on page load ...

I have seen that other people has this problem but the point is that adding "display: none;" solves the Flash problem on load but then the menu does not open anymore ...

Any idea when this bug will be solved or how to work around it?

wpexplorer commented 8 years ago

Make sure you have the negative default position on your sidebar (left/right classes) because the sidebar should be off the screen by default. Can you share the URL with the issue?

ps: If you want to use display:none; simply add another event to your button click that opens the sidr to also apply a display block (or apply it on window load, your choice) - simple fix ;)

rentageekmom commented 8 years ago

The default left/right positions are there, and this bug still exists. Happens on all browsers, but on Chrome it flashes on the left regardless of menu position with no animation, and on Safari we get it on the correct side, quickly transitioning out.

https://www.dealerinspire.com/tddsprogram/index.php/fuel-parts-possibilities/

Using the display:none hack doesn't work, the menu opens, but then fails to close.

rentageekmom commented 8 years ago

This worked:

CSS:

.sidr {
    display: none;
}

JS:

jQuery(document).ready(function($) {
//  Only display it once the page is fully loaded
    jQuery('.sidr.right').css('display','block');
});