Quantcast

Jump to content

» «
Photo

Sprite Problems

2 replies to this topic
TheBoneCountyButcher
  • TheBoneCountyButcher

    Ain't That Some sh*t

  • Members
  • Joined: 17 Feb 2006
  • United-Kingdom

#1

Posted 20 May 2011 - 01:10 PM Edited by gta_talk, 25 May 2011 - 07:22 PM.

nevermind

fred
  • fred

  • Moderator
  • Joined: 20 Jul 2002
  • None

#2

Posted 20 May 2011 - 03:15 PM

You need to use the :hover selector to change the background position.

HTML
<ul id="nav">
<li id="blog">Blog</li>
<li id="portfolio">Portfolio</li>
<li id="music">Music</li>
<li id="contact">Contact</li>
</ul>


CODE
ul#nav {
  list-style-type: none;
  margin: 0;
  padding: 0
}
#nav li {
  background-image: url(http://i56.tinypic.com/vct7i1.jpg);
  background-repeat: no-repeat;
  width: 86px;
  height: 50px;
  float: left;
  margin: 0;
  padding: 0;
  text-indent: -10000px;
}
#portfolio { background-position: -86px 0; }
#music     { background-position: -172px 0; }
#contact   { background-position: -258px 0; }

#blog:hover      { background-position: 0 -51px; }
#portfolio:hover { background-position: -86px -51px; }
#music:hover     { background-position: -172px -51px; }
#contact:hover   { background-position: -258px -51px; }


TheBoneCountyButcher
  • TheBoneCountyButcher

    Ain't That Some sh*t

  • Members
  • Joined: 17 Feb 2006
  • United-Kingdom

#3

Posted 20 May 2011 - 03:15 PM

Nevermind I have fixed it. Delete topic please.




1 user(s) are reading this topic

0 members, 1 guests, 0 anonymous users