HTML

質問

HTMLについてです。HPのテキストリンクで
リンク部分にマウスを乗せると文字の背景がキラキラと発光したような虹色に色が変化するタグを教えてください。どこを探しても見つからず質問させていただきました。よろしくお願いします。

回答No.4

noname#199778 · ベストアンサー

虹色に変化するというところが、いまいちきちんと理解できていないかもしれませんが…

もしその虹色が固定(経時的に変化しない)であれば、その虹色の画像を作って、それをリンクにマウスが乗ったときの背景画像にすればよいと思います。
それでしたら、CSSだけで対応できるでしょう。

<style type="text/css"><!--
a:hover{background-image: url("***.gif");}
--></style>

こうすると、マウスオーバーのときだけリンクの背景画像が変わります。

もし、マウスオーバーで背景色がくるくると変化するという意味でしたら、JavaScriptを使う必要があると思います。
サンプルを作ってみました。 head内に

<script type="text/javascript">
<!--
var cc="cdeffffed";

function start(obj){
if (document.getElementById){
n="rainbow('"+obj+"')";
RB=setInterval(n,100);
}
}

function rainbow(obj){
cc= cc.substr(1,cc.length)+cc.charAt(0);
cl= "#"+cc.substr(0,6);
document.getElementById(obj).style.backgroundColor=cl;
}

function stop(obj){
if (document.getElementById){
clearInterval(RB);
document.getElementById(obj).style.backgroundColor="transparent";
}
}

// -->
</script>

上記をそのままコピーしてください。 マウスオーバーで背景色を変えたいリンクは、

<a href="#" id="a1" onMouseOver="start(id)" onMouseout="stop(id)">リンク</a>
<a href="#" id="a2" onMouseOver="start(id)" onMouseout="stop(id)">リンク</a>

このように、id名を適宜設定し、「 onMouseOver="start(id)" onMouseout="stop(id)"」この記述をそのままタグ内に追加してください。
WindowsのIE6とNetscape 7.02、Opera7.11で動作確認してあります。

こんな感じではいかがでしょうか。
参考になれば幸いです。

お礼

これです!
ほんとうにありがとうございました!!

回答No.3

HIKALU

いや多分、こういう種類のリンクの事をおっしゃってるんじゃないかなぁと思うんですが、、、どうかな、、
↓
http://www.bea.hi-ho.ne.jp/jh8cmz/Html.htm
(これの１０番)

参考URL：

http://www.bea.hi-ho.ne.jp/jh8cmz/Html.htm

回答No.2

eboshiiwa

こんにちは。

たぶん下記サイトのサンプルでいいかと・・・
↓
http://www.zdnet.co.jp/help/tips/html/h0104.html
（マウスの軌跡に好みの画像を使いたい ）

あとこれも
↓
http://www.red.oit-net.jp/tatsuya/java/cursor.htm
（マウスカーソルについてくるイメージ）

参考URL：

http://www.zdnet.co.jp/help/tips/html/h0104.html,http://www.red.oit-net.jp/tatsuya/java/cursor.htm

回答No.1

HIKALU

どこかのHPでそういうリンクがあるのを見られたのでしょうか。もしそうなら、そのページのソースからタグを探すことも出来ますし、10100さんがそのサイトの管理人さんに直接尋ねてみるのもいいかもしれません。