スポンサーサイト
上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。


人気ブログランキング  

Page Top↑ 






 ROの作り方
RO(ロールオーバー)を使えばカーソルを乗せた時に違う画像を表示できます。

↓が↑のかめやま君のROのタグです。

<img src="http://blog-imgs-18.fc2.com/d/a/b/dabidabi/kame-mikki-1.gif" onMouseOver="this.src='http://blog-imgs-18.fc2.com/d/a/b/dabidabi/kame-mikki-2.gif'"onMouseOut="this.src='http://blog-imgs-18.fc2.com/d/a/b/dabidabi/kame-mikki-1.gif'"border="0">

フルパスで書いてあるので、このままコピーしても動くかもしれません。
最初と最後の<>は小文字に直してください。

長いようですが、基本の構文は↓だけです。
<img src="①" onMouseOver="this.src='②'"onMouseOut="this.src='③'">

①には最初に表示される画像のパスを入れます。
ここでは、この画像↓


②にはカーソルが乗った時に表示する画像のパスを
ここでは、これ↓


③にはカーソルが外れたときの画像のパスを
普通は①と同じですが変えてもかまいません。


<img src="①" onMouseOver="this.src='②'"onMouseOut="this.src='③'"onclick="this.src='④'">

↑のようにonclickを加えるとクリックしたときに④の画像が表示されます。
↓の画像にカーソルを乗せてからクリックしてみてください。



普通①②③④は同じ大きさの画像を使います。大きさが違ってもかまわないのですが、
①③より②が小さいとちょとマズイかも知れません。

簡単なので興味のある人はチャレンジしてみてちょ♪
JavaScriptが有効な環境で使えます。
スポンサーサイト


人気ブログランキング  
TB(0) | コメントにゃん♪(6) 
Page Top↑ 






 
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。