Menu collapses on loading in Firefox

[MrMister]

Hi there!

First let me say that I really enjoy the pixopoint menu plugin, it works really nice and has a lot of features. Great work!
I finished settting everything up and adding my styles and it now works like a charm, but there is one thing that keeps bugging me:

Whenever I reload the page from scratch (like a first time visitor), the full page is being loaded with the menu expanded. As I have a few menu items, it stretches over like one third of the page and only collapses after everything else has finished loading. I only encountered this problem in Firefox – IE and Chrome don’t seem to mind.

Is this any kind of known [s:17mn4hz4]bug[/s:17mn4hz4] feature in Firefox? Anyone got an idea what might cause this?

I would appreciate the help because I really love the plugin.

Thanks and all the best whishes,
MrMister

*EDIT*

I just checked again, it seems to happen at least in IE as well. 

[MrMister]

No one has an idea what the problem might be? I just checked every browser I have again, here’s what I came up with:

Menu collapsing on load ov every page:
[list:20yai4qd]
[*:20yai4qd]Firefox[/*:m:20yai4qd]
[*:20yai4qd]Chrome[/*:m:20yai4qd]
[*:20yai4qd]IE8[/*:m:20yai4qd]
[*:20yai4qd]IE7[/*:m:20yai4qd]
[*:20yai4qd]IE6[/*:m:20yai4qd][/list:u:20yai4qd]

It does however not collapse on every page, but only once very briefly on first load (I can live with that) on:

[list:20yai4qd]
[*:20yai4qd]Safari[/*:m:20yai4qd]
[*:20yai4qd]Opera[/*:m:20yai4qd][/list:u:20yai4qd]

Am I the only one experiencing this behavior?
I would really appreciate if someone could help me out.

If you might want to see for yourself, you can check out the current state here[/url:20yai4qd]…

Thanks,
MrMister

[Anonymous]

hello MrMister.
as you said, this is really useful plugin thanks for it.
but i have the same problem with you.. it’s so boring maybe i can give up using plugin because of this matter. Visitors really didn’t enjoy from this situation in my website:/
i hope there is a solution for it waitin’ an answr please help us:(

[imported_Ryan]

What exactly do you mean by "collapse on every page"? I can’t see any problem in Safari.

[MrMister]

Hello Ryan,

as posted above, the behavior does not seem to trigger in Safari, but most prominently in Firefox and IE. Insted of loading the menu the way it is supposed to look when in a non-hover state, every drop down menu becomes visible until the whole page (e.g. wp_footer I’d guess) is finished loading. Only then do all drop down menus retreat and can be used as actual drop downs. This is a very annoying behavior as they spread across half my page on first load and look very unprofessional, especially when on a slow connection with long page load times.  ” title=”Undecided” />

Another problem is that this behavior does not seem to be replicable on every system – please see the attached screenshot if it won’t happen on your system (you lucky bastard!  ” title=”Grin” />).

– Screenshot -[/url:37u1b4qp]

(Most of the times this behavior can be replicated by hitting Ctrl+Shift+R in Firefox, but not always and on all systems…)

Notice that the page is only 92% loaded? When comparing it to this page (geek.hellyer.kiwi), it seems that my menu is loaded ahead of everything else, while the menu on here is the last thing being loaded. However, I wasn’t able to find any option that would let me put the menu code in the footer or anything like that.

[imported_Ryan]

Hi,
Sorry, I didn’t read your post properly. I was answering about 50 of them all at the same time and must have been moving through them too quickly (I was WAYY behind on replying to questions).

I’m not sure exactly what your problem is, I can’t even replicate it actually. But I can see that your scripts are doing really weird stuff. jQuery is loaded [b:3ta5w5nb]after[/b:3ta5w5nb] the PixoPoint Menu plugin requires it, and the PixoPoint Menu scripts are being loaded via both wp_head() and wp_foot(), which is very odd.

Perhaps try changing to the default theme to see if this behaviour (where the scripts are loaded) occurs. If it doesn’t, then your theme is at fault. It’s hard to tell from here what that fault may be though.

[MrMister]

Hi Ryan,

thanks for the reply – I just checked the menu on the default theme, it seems to work there. I also tested if it has something to do with my CSS and disabled all styles for the menu, but that didn’t help either.
I even disabled all plugins to check for any incompatibilities, but the menu is still collapsing.

However, I found out that it has something to do with the caching of a browser, as the bug only occurs when the page is not yet in cache.

I really don’t know what part of my theme would cause this kind of behavior as I did nothing out of the ordinary – just some basic divs here and there and a stylesheet, all to 99% W3C conform.

Any idea why this only happens when the page is not yet in cache? Also, you mentioned that JQuery seems to be included too late – is there a way to force it to be loaded before PixoPoint Menu?

As my theme does not really have any special functionality, it does not seem to be related to activated plugins and I’m not the only one having this problem, this might be worth exploring further.

Greetings and thanks for the help so far!

MrMister

[imported_Ryan]

Have I read correctly that it is your theme which is the problem? I’m guessing the theme you are working on is loading it’s scripts incorrectly. If you attach it here I’ll take a look and if I can see any obvious errors I’ll let you know.

[MrMister]

Yeah, it seems to be somehow related to my theme as I could not reproduce it on the default theme.
This is the first theme I have created a theme by myself, but I checked all files for inconsistencies and couldn’t find anything wrong with it.

Thanks for taking a look ” title=”Smiley” />

Download the currenct state of the theme here[/url:lxljnxib]…

[Anonymous]

nope.. the problems source is not theme, problem is plug in trust me.
it’s happening here, too. let me show that with screen shots here:

if you go this page: https://geek.hellyer.kiwi/products/suckerfish_css/
then generate a dropdown menu quickly and submit it.
you’ll see this for a few seconds: http://i44.tinypic.com/11uddas.png
after seconds you see the dropdown menu normally like this: http://i43.tinypic.com/20uxwy1.png
this is soooooooo boring please help us ” title=”Sad” />((

[imported_Ryan]

That page does not use the plugin and is entirely unrelated to this issue.

That issue is because the CSS for that menu is declared inline in the page and browser is rendering the external file first, then loading the inline styles later on due to where they are in the source code. The plugins don’t do this hence this problem does not effect the plugins.

MrMister’s problems seem to be script related, not CSS related.

[imported_Ryan]

Was the following code in your theme originally? Or did you add it yourself?

[code:35by0nrl] <script type=’text/javascript’ src='<?php bloginfo(‘url’); ?>/wp-content/plugins/pixopoint-menu/scripts/hoverIntent.js.php?ver=r5′></script>
<script type=’text/javascript’ src='<?php bloginfo(‘url’); ?>/wp-content/plugins/pixopoint-menu/scripts/superfish.js?ver=1.4.8′></script>
<script type=’text/javascript’ src='<?php bloginfo(‘url’); ?>/wp-content/plugins/pixopoint-menu/scripts/superfish_settings.js.php?ver=1.0′></script>
[/code:35by0nrl]

That code makes no sense at all as it is just re-loading the plugins code and would definitely prevent it from functioning.

[MrMister]

Hi there,

I can’t remember to have put it there, but it is in my header.php and as I have written my theme from scratch I must have put it there sometime for some reason. I removed all three lines and this seems to solve the problem in Firefox, however not in Chrome or IE8, which makes it even more strange. 

Is there anything else I can do to help you figuring this out?

Greetings and thanks for your help so far,
MrMister

[imported_Ryan]

It appears to be working fine in Chrome for me.

[MrMister]

Hello Ryan,

I have moved the page from the former test server to the live productive server now because I wanted to test if it might have anything to do with some server variables or something – it was a long shot and didn’t really help, but I never really expected it to work after moving.

Anyway, I was able to idenfity a regularity: In [b:5nuuiw0p]Chrome[/b:5nuuiw0p], [b:5nuuiw0p]IE8[/b:5nuuiw0p] and [b:5nuuiw0p]Firefox 3.5[/b:5nuuiw0p] the menu seems to work if you navigate by internal links. I cleared all temporary internet files/cache files and started from scratch and it seems to work fine, but the menu still appears while loading when I hit Ctrl+R or Ctrl+Shift+R.

In [b:5nuuiw0p]Opera[/b:5nuuiw0p] the menu appears on first load, after that it renders the same behavoir as the browsers above.

[b:5nuuiw0p]IE7[/b:5nuuiw0p] on my VM will display the menu on every page load, regardless of hitting Ctrl+R or not.

My guess is that the menu script is not cached and/or loaded prior to the menu, because once everything is in cache it seems to work if you don’t reload the page manually.

Just to make sure I have tested a plain, freshly installed menu with no CSS and the bug is still triggering, so it does not seem to be CSS-related.

Sorry for bugging you with so many facts and questions, but it is a really annoying bug and I don’t really know where to look further. 

Greetings,
MrMister

PS: The site has moved here[/url:5nuuiw0p]. You can see the page by clicking "Admin Login" and using the following data:

Username: temp
Password: 123123

If you need admin access just let me know and I’ll PM you the user data.

[Author]

Posts