Menu shows all drop downs on front end when loading

I originally posted this in the Wayfinder forum, but am hoping it might get seen more by someone whose experienced this as well.



Im having an issue with my developer site. Its the main one I use to test modules, new javascript, jquery effects and the like.

It was originally in 1.0.4 just about to get upgraded to 1.0.8

When the front end loads - not matter what page its showing all the normally "hidden until rollover" menu items.

As this is the site I use to get all my modeles and slider effects in its way quicker for me to back the site up, load into new domain, change the configs and then start over on the new template.

All my favourite modules are already set up.

Its a huge timer saver apart from one thing which is really fustrating.

The menu was I believe altered the wayfinder or something, to show the drop down instantly by an ex member of staff whilst working on something. They then left the business and never changed it back and Im at a loss to know what they changed. I ahve asked them since- we still speak and they cant remember.

Apart from starting from scratch and installing ALL modules esp easy2gallery which Im loath to do due to time constraints.

Is it something fairly simple to fix, Im sure it is but cant figure it out.

Im not a php developer so this is an issue for me.

Ive attached a screenshot so you can see exactly what I mean.

any advice appreciated.

Thanks


Wayfinder config
configs/default.config.php

Wayfinder call

[[Wayfinder?startId=`0` &excludeDocs=`1` &outerTpl=`mh.OuterTpl` &innerTpl=`mh.InnerTpl` &rowTpl=`mh.RowTpl` &innerRowTpl=`mh.InnerRowTpl` &firstClass=`first` &hereClass=``]]

Quote from: ruthf at Feb 20, 2013, 06:55 AM

I originally posted this in the Wayfinder forum, but am hoping it might get seen more by someone whose experienced this as well.


[[Wayfinder?startId=`0` &excludeDocs=`1` &outerTpl=`mh.OuterTpl` &innerTpl=`mh.InnerTpl` &rowTpl=`mh.RowTpl` &innerRowTpl=`mh.InnerRowTpl` &firstClass=`first` &hereClass=``]]

Update have just checked on a "virgin" install of modx (1.0.4) completeley untouched by me.

and the Wayfinder call is the sameas on mine so am still STUCK.

Should I abandon this build and start afresh?

Hm, to me this seems to be more like a css issue than a php issue. I guess that the dropdown is initially hidden by visibility: hidden; or display: none; ... maybe the display:block; property is triggered by a .active class? Wayfinder sets this class for the active item...

additional information like wayfinder chunks and would be helpful =)

thanks will check the css

Wayfinder chunk? which bit?

The first thing I would try is to do a "View Source" on the page and check the paths to the JS and CSS files. The file that hides those drop-downs may not be loading. In some browsers, the links to the JS and CSS files are shown as links. If you click on them, you should see the JS and CSS code. If not, the path is bad.

While you're there, check the classes of the stuff that should be hidden and look for those classes in your CSS file. They may be misnamed or missing. If they're missing, look to the Wayfinder Tpl chunks and the properties in the Wayfinder tag.

The FireFox add-on Firebug can be really helpful in situations like this. You can click on the "inspect" button then on the sections that should be hidden and see what CSS rules are being applied.

Thanks Bob for taking the time to answer my question.

I have been looking- feel like Im searching for needle in the proverbial haystack.

Yes it loads ok in IE 9, in Firefox it shows for a millisecond, google chrome is the worst shows for 1-2 seconds.

I have a site using the same menu config that is ok.

Definitely looks like either the javascript or the css was modified to not hide these intially. Hopefully your friend just commented out the directives he didn't want rather than deleting them.

Thanks Susan.

I have checked the css and js files and they all load ok.

So now I need to find the css thats been commented out- Im pretty sure she wouldnt have edited the javascript

You might try putting style="display:none" into the tag that contains the stuff to be hidden. It might hide it permanently, but it might work.

If something is hanging for a few seconds (FOUC - Flash Of Ustyled Content) you could try putting as many of your javascript tags at the bottom of the template as possible. Most of them can go there.

When the browser sees a link to a javascript file, it stops processing until the file has been uploaded and the code added to the browser's working code. So if you have several large .js files to download before the menu-processing code is run, it will hang until the files are all downloaded. You can also try moving the menu-manipulation javascript code and files above all the others (except, of course the main .js library that the menu code is using).

The irony is that the exception to the above may well be your menu manipulation javascript. It may need to be in the template head so that it gets loaded before the menu's HTML is loaded. Working with Javascript can be tricky.