Stu Nicholls Prodrop2 implementation in Wayfinder

I’m willing to pay $200 for the implementation of Stu Nicholls’ Prodrop2 http://www.cssplay.co.uk/menus/pro_drop2.html implemented in Wayfinder for MODx 0.9.6.1.

If interested, please send email to [email protected].

I have done this in my local playground environment. It requires a few core hacks in Wayfinder to add more level templates and a support snippet to get it done. I do not have a live environment to show it. chick here for example the css still needs some fine-tunning

I have converted a couple of stu nicholl’s menus, never thought there will be a case where hacking wayfinder would be necessary I am curious to see this ! Anyway, great work Shane, it’s close to the original

Take a quick peek on webkit (Safari), but well done indeed.

LOL, it sure breaks down in safari. It is far from perfect that is why I did not place an official bid for the $$$. In looking at the code I see an error and will try to fix it.Fixed it in safari...it was a stupid mistake. Now all I am missing are the down arrows on the top level menu for the items with subs. Will need another snippet for this.

As for editing the code, if was only necessary to get the third level innerTpl and innreRowTpl. It may have been possible by editing the CSS but I kept it exactly as in CSSPlay. Actually by adding the level placeholder and using a little logic snippet you can do a lot of cool stuff. I would recommend that the level placeholder be added to the WF core since it is already available in the code anyway. I will detail what I did when I get some time.

EDIT: was able to add the arrows, now it is 100% (I have not tested it in windows). That was a fun exercise. here is the updated example

All in all it took two edits to the WF core and two support snippets. The CSS is untouched original as presented on CSSPlay, all the magic is in WF. There may be other ways of doing this without editing the code and by editing the css...but I could not figure it out. One thing to consider is that the original code is not 100%, it seems that there are leftover items from other menus ans Stu did not clear them out completely. I always assumed that the code would be clean but I have found that this is not always true.

Hi,

willing to share the hacks?

frank.

I can’t even begin to describe how I hate those ugly <!--[if lte IE 6]></td></tr></table></a><![endif]--> hacks all over the place... Life would be so much easier without IE...

Yeah those hacks are really ugly but frankly it’s genius from Stu to allow us to have pure css dropdown menus with no JS !
Kudos to him, and shame on Bill Gates

Quote from: Frank at Apr 23, 2008, 07:12 PM

willing to share the hacks?

I have been planning on documenting this as a "case study" but have not had the time. I have also been working on polishing it up a bit by adding the additional features to WayFInder but again I just have been short on time and I started to make to many changes and never got it finished (need to tatoo "KISS" on my forhead - KISS = Keep It Simple Stupid ). Drop me a PM with your e-mail and I will send them to you as is.

I promise I will post this for everyone to use as soon as I get a chance. And hopefully I will have an enhanced version of Wayfinder as well that will help make these menus a breeze.

As for the IE tags, I hate them too. But as long as we have to live with IE then there is no other way. Personally I have never used this on a project and stich to what can be done without it (or JS). Hurray for Stu, shame on Bill is right

Little off-topic but...

While "pure" css drop down menus are nice, I really don’t like them because if you go 1px off from the list item, the whole menu closes instantly.. That destroys the menu usability totally. Often when I try to traverse in the css drop down menus for like 4 levels deep, I may go bit off from some item and then have to do the whole thing again.. Most js based drop down menus have a delay setting that it doesn’t matter if you go off the menu items for a split second, the menu will still stay open..

Just my opinion, but I think that usability in js menus are much better (if you have js enabled ). Fall back to this kind of menu is good though..