だから、私はメニュー付きのこのhtml Webページを持っています。メニューを 3 つのリンクを含むリストとしてコーディングしました。
メニューはIllustratorのpng画像で構成されています：ホーム、連絡先など。達成したいのは、リンクにカーソルを合わせると、特定の色が左からスライドすることです。この特定の色も Illustrator のイメージです。
メニューの単純なプレーンテキスト、背景スライドの画像、jQuery: jQuery buttonsを使用して(チュートリアルで)これを行うことができましたが、2つの画像でこれを行いたいです。
私は自分自身を正しく説明していますか？どうすればこれを行うことができますか?
これを実現する方法はいくつかありますが、ここでは 3 を示します。
1) 背景画像スプライトに透明画像を含めます。つまり、両方の画像を組み合わせて、1 つの背景画像として使用しています。次に、それに応じて背景画像を配置します。スプライトに慣れていない場合は、CSS スプライト ボタンについて説明している投稿をご覧ください。
2) 画像をリンクにハード コードし、css を使用して背景色を生成します。そうすれば、別の画像を使用する必要はありません。例: a:hover { background: #f00; }
3) 画像をリンクにハードコーディングし、背景画像を使用してホバー効果を実現します。リンクが検索不能になり、選択不能になるため、これはお勧めしません。