0

私の質問は、gif をさらに進めて position: を選択できない理由です-60px。私はラッキーなことを試してきました...何か提案はありますか？これを jsFiddle でお見せしたかったのですが、GIF をサイトにアップロードする方法がわかりません。

<div id="container">
  <div id="mainContent">
    <h1> Main Content</h1>
        <div id="icon">

          <a href="#row_01" title="01A">01A</a>    </div>
    <h2>H2 level heading </h2>
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam,  justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam  ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo  porttitor, felis. Nam blandit quam ut lacus. Quisque ornare risus quis  ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean  sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at, odio.</p>
    <!-- end #mainContent --></div>
<!-- end #container --></div>
</body>
</html>

CSS

#icon a
{
    background-image: url(../img/icon.gif);
    background-position: 0px 0px;
    background-repeat: no-repeat;
    display: block;
    overflow: hidden;
    text-indent: -99999px;



    width: 30px;
    height: 30px;
}

#icon a:hover, #icon a:focus
{
    background-position:  -30px 0;
}

#icon a.selected, #icon a.selected:hover

{
    background-position:  -60px 0;
}
4

1 に答える 1

2

画像が実際に少なくとも 90 幅である限り、問題はありません。

selectedプレースホルダー画像を含むコードと、画像をクリックしたときにクラスを切り替えるコードを次に示します。

http://jsfiddle.net/wwRed/

于 2011-06-29T11:55:15.880 に答える