Thread

Hey guys,

I’m always loved the approach taken for designing code igniter’s web page. Expression Engine does an excellent job as well. Kudos to whoever put that together.

I’m curious if anyone would be kind enough to share how to get the effect of the tabs on the front of the page. When you mouseover, it appears as if the tabs are almost translucent / transparent…  I’m not sure if that’s simple imagery, or just cleverly crafted CSS?

I’m more of a back-end developer who’s recently venturing into the world of front-end styling/design, so I’m very curious to how it’s done for my own sake of mind.

Thanks a lot.. 😊  oh btw.. the same effect is used on facebook as well..

- sf

A combination of CSS / imagery - let’s see if I can find some links for you:

Google:// CSS Sliding Doors Technique
Google:// CSS Unordered List Horizontal Menu
CSS Showcase: Navigation Techniques
CSS Drive: Horizontal Menu Designs

Based on the drop shadow at the bottom of the tabs, I believe (without looking at the code) CI is using the sliding doors technique (or just swapping images). Basically, you define a background image for the a tag and a different background image for a:hover.

Very cool Michael!

BTW I left a comment on your blog the other day re: your authorization module. I’m going to give it a twirl when I put together a website for my fiance and myself.  Getting the wedding stuff going… 😊

- sf

http://www.digital-web.com/articles/redesigning_the_expressionengine_site/

Wow nice thurting. I’ll have to read that article after Nip/Tuck tonight. 😊

Yeah, Jesse (the designer) did great work.