0

CSS3 では、1 つの要素に複数の背景画像を設定できることをご存知ですか?

background-image: url(image.png) , url(image1.png);

「ホバー」イベントで、現在の画像 URL を置き換えることなく、別の画像 URL を追加する必要があります。

私はもう試した:

element:hover
{    
    background-image: url(image1.png);    
}

運がない。

ただし、ホバーイベントですべての画像を再割り当てするだけで、すべてうまくいきます:

element:hover
{    
    background-image: url(image.png) , url(image1.png);    
}

idしかし、ID ごとに異なるプライマリ イメージを割り当てるために を使用しているため、それはできません。だから、このようなもの:

.buttonClass
{    
/*width and height stuff here*/    
}

.buttonClass:hover
{    
/*this is where I add my ADDITIONAL image*/    
}

#buttonONE
{    
/*this is where I assign my primary image*/    
}

#buttonTWO
{    
/*this is where I assign my primary image from buttonTWO
  which is different from the image assigned to buttonONE*/    
}

SO にはidID ごとに異なるため、プライマリ イメージが含まれます。だから私はただ行うことができます:

#buttonOne:hover
{
/*but, the hover image (the additional image) I want to append will 
  not differ at all. It will always be the same.*/
    background-image: url(image.png) , url(image1.png);    
}

#buttonTwo:hover
{
/*so this method is pretty messy and pointless, 
  unless of course, it's the only way?*/
    background-image: url(imagedsfsdf.png) , url(image1.png);    
}

だから、クラスのホバーに追加するだけで不要なホバーをあちこちに投げつけたくありませんよね?

それで、何かアイデアはありますか?

ああ、もう1つ-JSとjQueryを除外したいと思います。他に方法がなければ...

4

3 に答える 3

0

このようなことを意味しますか?http://jsfiddle.net/demchak_alex/UaApb/

サイズの違いは、何が起こっているかを説明するためだけのものです.50-75-100

于 2012-08-01T06:47:12.980 に答える
0

Mkae a fiddle or dabblet then we all can help better

于 2012-08-01T06:36:51.867 に答える
0

複数の HTML 要素を使用するのは論理的でしょうか? たとえば、親イメージはそのまま残りますが、子要素のイメージは、親の上にカーソルを合わせると変化します。

あなたのCSSはずっときれいになるでしょう

于 2012-08-01T07:25:13.207 に答える