2008年11月19日
2006年07月30日
ロールオーバーを使ってみましょう。(JS初級)
マウスを当てると画像が変化するロールオーバーを使って遊んでみました(*^-^)
設定は簡単ですよ。
設定は簡単ですよ。
<img src="最初に表示したい画像のURL"
onmouseover="this.src='マウスをあてたときに表示したい画像URL'"
onmouseout="this.src='マウスを離したときに表示したい画像URL'"
alt="画像の代わりの文字" width="幅" height="高さ" />※これは説明の都合で４行になっていますが、実際は半角スペースでつながった１行です。
ロールオーバーは通常、「最初に表示したい画像のURL」と「マウスを離したときに表示したい画像URL」を同じ画像にします。
また、使用する画像のサイズ(width="幅" height="高さ")は、全部同じサイズのものにしてください。
↓ ぽちっと応援お願いします♪ m(_ _)m
≪New MENSAのWorkout久々のクイズです♪ | Top | BlogPetキリぺたのカウプレいただきました♪ Old≫
トラックバックURL
トラックバック
≫ 青空の下で from グリーティングカード
先日代々木公園に行ったときの写真。なんか、こう・・ ボーーーーーーっとしたい♪とかって気持ちをかき立てられるような風景だったなぁ〜♪お盆の予定は仕事のみっていう、なんとも色気の無いスケジュ [Read More]
トラックバック
≫ ｷﾀ━━━(ﾟ∀ﾟ)━━━ｯ!! from さるのこしかけ
何が来たって･･･ 初雪!! マウスを乗せてみて下さい･･･ｿｯﾁ (。・・)σこの所天気が悪く気温も下がっていましたが･･･雨がみぞれに･･･で･･･あられ･･･ あっという間に真っ白になりましたよ*:.｡.:*・(*´∀｀)ﾟ｡.:・* 直ぐ解けてしまうし、積もるまで� [Read More]
トラックバック
≫ うさびアイコンをいただきました♪ヽ(=´▽`=)ノ from のんびり前進じたばた生活
皆様、昨日はお祝いコメント、メッセなどなど本当にありがとうございました♪(*- -)(*_ _)ペコリ新たな一年のスタートの日が素晴らしい日になりました♪ｳﾚｼ━━━━｡+ﾟ(*´∀｀*)｡+ﾟ━━━━ｨｲ!!いろいろと誕生 [Read More]
コメント
こういう基本的なことを〜〜。。。凹○ｺﾃｯ
送信させていただきましたのでお知らせでーす(｡･ω･｡)ゞピッ♪
Posted by モンビッケ at 2006.08.10 20:22 | edit
コメント
＞yozoさん、トラバおそくなりましてm(･ω･`m)ｺﾞﾒﾝﾁｬ
いえいえ♪こちらこそ、催促してお手間取らせました。m(_ _)m
紹介してくださったので、試作品だったロールオーバーの見本を
ブレのないものにやり替えましたよ。モンビッケさんに恥をかかせる
わけにはいかないですからね。(ﾟ-ﾟ*)(｡｡*)ｳﾝｳﾝ
トラバ返してくださってありがとーございまっす♪m(_ _)m
Posted by モンビッケさんへ at 2006.08.10 21:42 | edit
コメント
お知らせありがとうございました！
以前は３行だったけど４行になってたのですねφ(･ω･*)ﾌﾑﾌﾑφ(｡_｡*)ﾒﾓﾒﾓ
この属性・・普通のhtmlでも同じように表記すれば大丈夫なんでしょうかね・・
最後の「半角スペース+スラッシュ」を省けばいいのかなぁ・・・
すみません；；お知らせいただいたのに質問になっちゃいました・・
というのも、テンプレート自体がまだXHTMLじゃないのですよ(･ω･;A)ｱｾｱｾ…
テンプレートをXTMLに書き替えればいいのかもしれないのですが
戦うにはかり時間がかかりそうなので、先延ばしになっている次第です＾＾；；
Posted by モンビッケ at 2006.08.31 10:42 | edit
コメント
早速見に来てくださったのですね。ありがとーございまっす♪m(_ _)m
＞この属性・・普通のhtmlでも同じように表記すれば大丈夫なんでしょうかね・・
＞最後の「半角スペース+スラッシュ」を省けばいいのかなぁ・・・
おっー！そうでしたね。モンビッケさんのテンプレは、
HTML4.01 Transitionalでしたね。（;￣ー￣A ｱｾｱｾ･･･
ご質問の通りです。最後の「半角スペース+スラッシュ」を省けばＯＫですよ。
ドタバタさせちゃってごめんなさいでした m(_ _)m
Posted by モンビッケさんへ at 2006.08.31 11:54 | edit
コメント
解説ありがとうございますー！
早速次回からこのページを参照しつつ（もうブックマーク更新しちゃいました♪(ノ∀`)ウフ
ロールオーバーを使いたいと思います(｡･ω･｡)ゞピッ♪
> ドタバタさせちゃって
いえいえ、とんでもないです。大変勉強になりますし
今までは画像サイズも入れていなかったので、また一歩躍進できます！
わぁ━━ヽ(｡･ω･｡)ﾉ━━ぃ!!
Posted by モンビッケ at 2006.08.31 18:04 | edit
コメント
＞解説ありがとうございますー！早速次回からこのページを
＞参照しつつ（もうブックマーク更新しちゃいました♪
いえいえ♪こちらこそ大変勉強になります。なかなかWeb構築の経験不足なもので、三歩進んで二歩退くという感じですね。（;￣ー￣A ｱｾｱｾ･･･
＞ロールオーバーを使いたいと思います(｡･ω･｡)ゞピッ♪
とても上手につかってるので、yozoも勉強になります。(*^-^)
＞今までは画像サイズも入れていなかったので、また一歩躍進できます！
alt、width、heightを入れるところまでは同じですからね。
誰にでも優しいブログ作りができればいいですよね(ﾟ-ﾟ*)(｡｡*)ｳﾝｳﾝ
Posted by モンビッケさんへ at 2006.08.31 21:39 | edit
コメント
ウッキはダメです･･･無作法すぎましたね･･･m(_ _"m)
うまくいくか心配だったので、成功して皆さんに見えていたら
別記事でｙｏｚｏさんをご紹介しようとしたのですが･･･
先にｙｏｚｏさんが見つけてくれました(T-T)
とても嬉しく･･･そしてご挨拶を先にするべきだったのに申し訳なく･･･m(_ _"m)
いつもありがとうございますm(_ _"m)
ご覧いただいたように、class="○○"と align="left"を追加してやってみました♪
宿題ひとつクリアでっすm(_ _"m)
Posted by ウッキ at 2006.11.12 14:14 | edit
コメント
２枚の画像を載せる記事ができました♪
ＴＢ送信させていただきますので、不手際がありましたらご指摘いただければと思います
宜しくお願いいたしまっすm(_ _"m)
Posted by ウッキ at 2006.11.12 16:37 | edit
コメント
＞ｙｏｚｏさん、こんにちヮ〜♪コメントをありがとうございましたっ♪
いえいえ♪たまたまお邪魔したら、ロールオーバーでしたからね♪
うまくできていましたね♪(*ﾟｰﾟ)(*｡_｡)ｳﾝｳﾝ♪(ﾟｰﾟ*)(｡_｡*)ｳﾝｳﾝ♪
＞ウッキはダメです･･･無作法すぎましたね･･･m(_ _"m)
いえいえ♪そんなことは・・・yozoの記事を参考にしてくださっていたのですね♪ロールオーバーの解説なら、あちこちでも説明されていますから。お気になさらないでくださいね♪(^○^)
＞ご覧いただいたように、class="○○"と align="left"を追加してやってみました♪
align="left"はclass="○○"のCSSコードの中にfloat:left;とした方がXHTML準拠の書き方になりますよ。ご参考までに。m(_ _)m
Posted by ウッキさんへ at 2006.11.12 16:45 | edit
コメント
たった今レスコメントを投稿したら、ウッキさんのコメントが入ってビックリしました(*^-^)
＞ちょうど初雪が降って２枚の画像を載せる記事ができました♪
そのようですね。たった今、お邪魔させていただいたところです。(^○^)
不手際等はございませんよ。丁寧に紹介していただき、その上、ＴＢまで入れていただいて、ありがとーございまっす♪ 参考にしてくださってうれしいですよ♪ m(_ _)m
Posted by ウッキさんへ at 2006.11.12 16:49 | edit