Jump to content

  • Log in with Facebook Log in with Twitter Log In with Google      Sign In   
  • Create Account

Subscribe to HRA Now!

 



Are you a Google Analytics enthusiast?

Share and download Custom Google Analytics Reports, dashboards and advanced segments--for FREE! 

 



 

 www.CustomReportSharing.com 

From the folks who brought you High Rankings!


Sponsored Content

 

 
 

Photo
- - - - -

The Perfect Css Menu


  • Please log in to reply
13 replies to this topic

#1 linux_lover

linux_lover

    LiLo

  • Active Members
  • PipPipPipPipPipPip
  • 831 posts
  • Location:York, UK

Posted 05 January 2005 - 04:42 AM

Just had to post this:

Suckerfish dropdown menu

A nice bit of scripting... standards complient, works in everything (well not sure about ancient browsers but who cares) CSS menu. (drum roll).

Shame about the necessary bit of JS for IE, but thats bills fault.

#2 qwerty

qwerty

    HR 10

  • Moderator
  • 8,287 posts
  • Location:Somerville, MA

Posted 05 January 2005 - 08:20 AM

I'm rather fond of http://www.seoconsul...nus/horizontal/ and
http://www.seoconsul...menus/vertical/

I think they're both based on the suckerfish menus.

#3 pageoneresults

pageoneresults

    HR 4

  • Active Members
  • PipPipPipPip
  • 116 posts
  • Location:Orange CA USA

Posted 05 January 2005 - 10:05 AM

QUOTE(qwerty @ Jan 5 2005, 06:20 AM)
I think they're both based on the suckerfish menus.
Hello qwerty, thanks for the compliments on the menus. Claire thanks you too!

Actually when I first set out to develop these menus, the Suckerfish solution was a starting point. Then Claire from Tanfa introduced me to the Peterned .htc file which replaced the Suckerfish solution I had developed.

We are also in the process of developing another version that uses the IE7 javascript solution. We want to make multiple menus using various solutions and allow our visitors to make a choice based on their environment and level of compatibility.

Unfortunately we are finding out that the popouts do not work in IE5.x. In our environment, that doesn't present too much of a problem because all of our sub-directories have an index page which lists all pages within that section. So, no popout but, they can click on the link and bring up a static page with what looks like a search engine results page with a title and description for each page in that section.

We've got more in the works so keep an eye on the above space.

#4 eragon

eragon

    HR 4

  • Active Members
  • PipPipPipPip
  • 117 posts

Posted 05 January 2005 - 10:08 AM

The guys over at Milonic have a pretty cool menu with lots of options. The transition effects, sadly, only work in IE though.

#5 linux_lover

linux_lover

    LiLo

  • Active Members
  • PipPipPipPipPipPip
  • 831 posts
  • Location:York, UK

Posted 05 January 2005 - 10:21 AM

QUOTE(pageoneresults @ Jan 5 2005, 03:05 PM)
Actually when I first set out to develop these menus, the Suckerfish solution was a starting point. Then Claire from Tanfa introduced me to the Peterned .htc file which replaced the Suckerfish solution I had developed.

Unfortunately we are finding out that the popouts do not work in IE5.x. In our environment, that doesn't present too much of a problem because all of our sub-directories have an index page which lists all pages within that section. So, no popout but, they can click on the link and bring up a static page with what looks like a search engine results page with a title and description for each page in that section.



Thats why the suckerfish one doesnt use .htc file - as it wont work with IE5, their Javascript function cures it, plus its a lot less code. I went along the same path before finding someone had already done one for me....

Edited by linux_lover, 05 January 2005 - 10:22 AM.


#6 Kev

Kev

    HR 5

  • Active Members
  • PipPipPipPipPip
  • 286 posts

Posted 05 January 2005 - 10:57 AM

Dunno about 'perfect' but this one is lovely to look at and use:

http://www.aleto.ch/

#7 Randy

Randy

    Convert Me!

  • Moderator
  • 17,540 posts

Posted 05 January 2005 - 11:15 AM

Isn't CSS fun? wink.gif

Lately I've taken to incorporating a CSS with a bit of JS and even PHP to create a menu/sub-menu system that keeps everyone rightly focused on the section of a larger site that they're on. Sort of like a breadcrumb trail, without the breadcrumbs. Instead the nav blocks reflect where you're at in a general way.

I've decided to use both a top nav that is horizontal, with main link "buttons" at the top and a sub-menu directly below that, which uses Javascript to make the sub-menu's appear. I'm also including a left nav menu that doesn't depend upon JS at all, so as to be search engine and accessibility compliant.

The little PHP bit to expand the appropriate menus is pretty slick, if I do say so myself. Laughably easy to do once you get your head around the concept. As soon as I get it all done and working on a couple of real live sites I'll probably publish the code so that others can use it if they want.

Since it incorporates PHP, it uses a few includes as you might imagine, but that makes it easy to change menus of each sub-section if you need to in the future by changing one file instead of 200. Best of all worlds for me. I can change the whole thing for thousands of pages by changing just a few files!

#8 torka

torka

    Vintage Babe

  • Moderator
  • 4,392 posts
  • Location:Triangle area, NC, USA, Earth (usually)

Posted 05 January 2005 - 11:35 AM

QUOTE(Randy @ Jan 5 2005, 11:15 AM)
As soon as I get it all done and working on a couple of real live sites I'll probably publish the code so that others can use it if they want.
View Post


Oooh, I'll be sitting on the edge of my seat waiting for this! (Really!) That would exactly fill the bill for something I've been wanting to do on a couple of my sites.

Do we have a pleading-puppy-dog-eyes smilie around here somewhere... toddles off to look... Well, nothing exactly right, but how about these notworthy.gif :shy:

--Torka mf_prop.gif

#9 Randy

Randy

    Convert Me!

  • Moderator
  • 17,540 posts

Posted 05 January 2005 - 01:43 PM

maybe something like this Torka? wink.gif

Attached Images

  • puppy_eyes.gif


#10 chrishirst

chrishirst

    A not so moderate moderator.

  • Moderator
  • 5,879 posts
  • Location:Blackpool UK

Posted 05 January 2005 - 01:49 PM

I've used ASP and CSS to do similar, in a collapsible menu/sub-menu/sub-sub-menu (and deeper if you want to get really silly).
It will get converted to PHP at some point. (and both versions published)

www.cands.dnsalias.com/ no javascript was injured in the making of this menu biggrin.gif (Though it could easily be added to the top level )


playing with a ASP/CSS tabbed menu as well that will get the code published

#11 sweepthelegnate

sweepthelegnate

    HR 6

  • Active Members
  • PipPipPipPipPipPip
  • 903 posts
  • Location:Dallas, Texas

Posted 05 January 2005 - 01:52 PM

those menus are pretty useful, saw them a while back on a list apart. The seems to have inspired a lot of the menus out there...

Randy - those menus you're working on sound great.


nathan

#12 McFox

McFox

    HR 5

  • Active Members
  • PipPipPipPipPip
  • 332 posts
  • Location:Sunny Scotland; no wait, rainy .. no, snowing, ...ah Sunny again.

Posted 07 January 2005 - 04:33 PM

I don't think you can discuss CSS menus without including the examples at Listamatic

Some nice designs.

#13 sweepthelegnate

sweepthelegnate

    HR 6

  • Active Members
  • PipPipPipPipPipPip
  • 903 posts
  • Location:Dallas, Texas

Posted 07 January 2005 - 04:39 PM

here's another set...not as many as those listed above, but could be a good starting point for some. Elusion menus


nathan

#14 eragon

eragon

    HR 4

  • Active Members
  • PipPipPipPip
  • 117 posts

Posted 07 January 2005 - 04:40 PM

QUOTE(McFox @ Jan 7 2005, 03:33 PM)
I don't think you can discuss CSS menus without including the examples at Listamatic

Some nice designs.
View Post


It's Christmas all over again! clapping.gif Thanks for adding, McFox.




0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users