0

WordPress でカスタム メニューを作成し、div スタイルを追加して、テキストをクリック可能な画像に変換しました。

<div style="
    background-image: url('http://www.luchaquest.net/home/wp-content/uploads/2012/12/first.png');
    background-repeat: no-repeat;
    display: center;
    margin: 0;
    padding: 0 0 0 20px;
    width: 195px;
    height: 70px;
"></div>

これまでのところすべてが機能していますが、ホバーアクションも欲しいです（行を持つことで達成できるはずbackground-position: 0 -195pxです）私はこのスタイルのプログラミングにまったく慣れていません。

ホバー情報をすべて同じ要素内のこのコードに追加するにはどうすればよいですか?

4

2 に答える 2

1

マウスオーバー機能を使用する

<div id="divID" onmouseover="javascript:UpdateBackground();" style="
background-image: url('http://www.luchaquest.net/home/wp-content/uploads/2012/12/first.png');
background-repeat: no-repeat;
display: center;
margin: 0;
padding: 0 0 0 20px;
width: 195px;
height: 70px;
"></div>

<script type="text/javascript">
    function UpdateBackground(){
    alert('before update');
document.getElementById("divID").style.backgroundPosition="center bottom";
    alert('after update');
    }
</script>​
于 2012-12-17T06:54:11.690 に答える