Comments on: How to Make a CSS Sprite Powered Menu

By: 30 آموزش ساخت منو CSS جذاب - مجله فناوری اطلاعات

30 آموزش ساخت منو CSS جذاب - مجله فناوری اطلاعات — Wed, 08 Feb 2012 14:05:27 +0000

[...] آموزش ایجاد یک منو CSS می باشد که سریع بارگذاری شود!لینک به آموزش۵٫ CSS3 Mega Drop-Down MenuCSS3 Mega Drop-Down Menuاگر شما صاحب یک فروشگاه [...]

By: 10 Awesome CSS Navigation Menu Creation Tutorials | Spicer Designs – Tech News, Gossip and Game Reviews

Tue, 31 Jan 2012 10:34:42 +0000

[...] Go to tutorial [...]

By: Ryan Johnson

Ryan Johnson — Fri, 27 Jan 2012 05:48:07 +0000

Hey Toni, the those positions come from what you see under the “Love the Grid” section. Put it this way:

> Your height and width are like a square hole in a piece of paper.
> The sprite is like another piece of paper with a bunch of images. While you have a bunch of images, you can only see whatever through that hole on the top piece of paper (height/width).
> The overflow:hidden is what hides the rest of the sprite paper except for what can be seen through that hole.
> Background-position basically shifts the sprite piece of paper around to display the desired sprite image you want to snugly display.

That’s just how I imagine it, but hopefully it helps!

By: Arjun Rajiv

Arjun Rajiv — Fri, 20 Jan 2012 11:38:06 +0000

Thanks a lot, great tutorial…..

By: 30 Excellent CSS Menu Tutorials | stylishwebdesigner

30 Excellent CSS Menu Tutorials | stylishwebdesigner — Thu, 29 Dec 2011 18:22:17 +0000

[...] How to Make a CSS Sprite Powered Menu [...]

By: Toni

Toni — Sun, 11 Dec 2011 02:14:58 +0000

I’m following you so far and it has been relatively easy once I got over the learning curve. I’m puzzled though as to where these coordinates come from:

#menu li.home a{background-position:-5px -5px;}
#menu li.home a:hover{background-position:-5px -75px;}
#menu li.home a.selected{background-position:-5px -145px;}

I have all of my width and heights for my three states but I just don’t know how to do the background position. Help! Please. Thanks.

By: Juve Colunga

Juve Colunga — Fri, 18 Nov 2011 18:15:52 +0000

Thanks a lot, too comprehencive tut

By: 100 Great CSS Menu Tutorials（创建css菜单的100种教程） | 别动设计

100 Great CSS Menu Tutorials（创建css菜单的100种教程） | 别动设计 — Tue, 15 Nov 2011 12:58:20 +0000

[...] 8. How to Make a CSS Sprite Powered Menu [...]

By: Neil Gee

Neil Gee — Fri, 11 Nov 2011 10:27:03 +0000

Thanks for this! works great

By: mahsa

mahsa — Mon, 07 Nov 2011 20:37:10 +0000

hiiiii zach
thanks alot!!!!