0

動作するはずだと誓うわずかな問題があります...ちょっとばかげた質問のように思えます...しかし、ここにあります...作成したdivをボタンとして機能させたい...それは決して望んでいませんクリックしたときに背景を変更するには(ボタンの効果を与える)、ここに私のコードがあります:

<!doctype html>
 <html>
 <head>
 <meta charset="utf-8">
 <title>Untitled Document</title>
 <style>
 #button1 {
     width:100px;
     height:50px;
     background-image:url(normalbutton.jpg)
 }
 </style>
 </head>

 <body class="asd">
 <div id="container">
 <a href="#">
 <div id="button1" onmousedown="document.getElementById("button1").style.backgroundImage='url(onmousedownbutton.jpg)'"></div></a>

 </body>
 </html>
4

6 に答える 6

1

二重引用符の中に二重引用符を使用します。次のように、 button1を囲む引用符を一重引用 符に変更します。<div id="button1" onmousedown="document.getElementById('button1').style.backgroundImage='url(onmousedownbutton.jpg)'"></div>

その他の注意事項:

  • あなた<div id="container">は閉鎖されていません
  • <div>内部では使用できません<a>
于 2013-10-25T08:18:00.170 に答える
1

css を使用するだけです:

HTML

<html> 
<body class="asd">
 <div id="container">
   <a href="#">
     <div id="button1" ></div>
   </a>
  </div>
 </body> 
 </html>

CSS

#button1 {width:500px;height:500px;background:red}
#button1:hover {background:green;}
#button1:active {background:grey;}
于 2013-10-25T08:22:12.603 に答える
0

css を試すこともできます。

#button1:focus {
  background: url(onmousedownbutton.jpg);
}

また

#button1:active{
  background: url(onmousedownbutton.jpg);
}
于 2013-10-25T08:20:02.097 に答える
0

ブシャンの答えに基づいて、マウスを押したままにするとダウンクリック画像に切り替わり、マウスボタンを離すと元の画像に戻ります。

$("#button1").mousedown(function() {
    $(this).css({'background-image': 'url(image2.jpg)'}) 
}).mousedown(function(){
    $(this).css({'background-image': 'url(image1.jpg)'}) 
});

HTML:

<div id="button1" style="background-image:url('image1.jpg');"></div>

ソース/参考文献:

CSS background-image - 正しい使い方は?

于 2014-02-16T22:35:55.080 に答える
0

このようにマウスダウンを変更します

 <a href="#">
 <div id="button1" onmousedown="this.style.backgroundImage='url(http://t3.gstatic.com/images?q=tbn:ANd9GcT6-aJ6Hz_oXi_M2ZScbEiNGKZFKN3hyhffh2NMWTmbgU2WX-IZKA)'">Button
</div>
</a>

ライブデモ

onmousedown="this.style.backgroundImage='url(http://t3.gstatic.com/images?q=tbn:ANd9GcT6-aJ6Hz_oXi_M2ZScbEiNGKZFKN3hyhffh2NMWTmbgU2WX-IZKA)'">

私はいくつかのカスタム画像で見栄えがするように、Google からいくつかの画像を使用しました。:)

于 2013-10-25T08:18:45.567 に答える