リンクじゃないテキストの色をマウスオーバーで変えたい

解決済

質問者：penguin88
質問日時：2007/06/25 15:08
回答数：2件

リンクじゃないテキストの上にカーソルがきたときに
テキストの色を変えるにはどうしたらいいのでしょうか？
テキストをクリックするとポップアップウィンドウがでるのですが、
そのテキスト部分を、マウスオーバーで色が変わるようにしたいのです。
ポップアップウィンドウはJavascript:;で設定しています。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (2件)

No.2

回答者： steel_gray
回答日時：2007/06/25 15:31

HTMLで、

…テキスト<strong onclick="・・・">ここをクリックするとポップアップ
</strong>テキスト…
と、なっていたら

CSSで
strong[onclick]:hover{color:red;cursor:pointer;}
/*onclick属性が記述されているstrong要素のhover状態で
色を赤にして、カーソル形状をpointer（一般にリンクと同じもの）に変える
*/

ただし、IEは7以降で、標準準拠モードでしか対応してません。
（他のメジャーなブラウザは既に対応している）

IE6以前も対象とするなら、javascriptを使って。
<strong onclick="・・・"
onmouseover="this.style.color='#ff0000';this.style.cursor='pointer'"
onmouseout="this.style.color='';this.style.cursor=''"
>ここをクリックするとポップアップ
</strong>

- 0
- 件

通報する

No.1ベストアンサー

回答者： yambejp
回答日時：2007/06/25 15:28

IEを無視してよいなら、span:hoverなど使えるのですが、まぁそうも

いかないでしょうから・・・。

こんな感じで色を変えたい部分にIDをふって、onloadでmouseoverと
mouseoutを調整してみてください。

<head>
<script language="javascript">
window.onload=function(){
var hoge=document.getElementById('hoge');
hoge.onmouseover=function(){this.style.color="red";}
hoge.onmouseout=function(){this.style.color="";}
}
</script>
</head>
<body>
色を変える→<span id="hoge">ここ</span>←色を変える
</body>