当ページの概要マウスを載せると画像を変える方法です。Javascriptを使えば簡単に実現できます。Javascriptマウスオーバーで画像変更スクリプトマウス操作で画像を変更(汎用型)Javascriptを使うことで「画像にマウスポインターを乗せて画像を変更する」ことが出来ます。やり方もとても簡単です。マウスポインターが乗ると「onmouseover」イベントが発生し、マウスポインターが放れると「onmouseout」イベントが発せします。そこで、onmouseoverイベント発生時に画像を変更させ、onmouseoutイベント発生時に画像を元に戻せば、マウスポインターが乗っているときだけ画像変更が実現できます。詳しくは下記のソースを参照下さい。onmouseout="document.画像ID.src='元画像URL';">画像変更</span>普段通りに画像を表示するimgタグ内に「name="ch_img"」と記述し「ch_img」という名前を付けます。次にspanタグでimgタグを囲みます。spanタグにマウスが乗ったときの「onmouseover="document.ch_img.src='変更画像URL';"」と離れたときの「onmouseout="document.ch_img.src='元画像URL'"」を記述します。「document.ch_img.src='画像URL';」は「ch_img」と名前が付いた画像を指定の画像に入れ換えるJavascriptの命令です。onmouseout="document.pid_332.src='/_file/jsmpl_mo_01.gif';">画像変更</span>マウス操作で画像を変更(簡易型)基本的に上記と同様ですが、span要素が不要でimg要素のみで簡潔します。文字にマウスを乗せると変更という形にはできませんが、画像にマウスを乗せるという形であれば、簡単に実現できます。画像IDは自動で作成されますので指定する必要はありません。元画像URLに静止画、変更画像に動画を指定すると見かけ上のアニメ再生機能が備わります。縦リンク時の画像の外枠なしリンクを張るときに画像の外枠をなくせます。(作成タグをホームページに貼り付けて使いましょう!)画像変更タグ作成スクリプトでは、Javascript(ジャバスクリプト)を利用しています。Javascriptがオフの場合はお使いになれません。Javascriptが無効です。有効にしてアクセスして下さい。いいえコメント:質問の際は詳細にお願いします。...若干上品になった気がする。Asakoありがとうございます!とても便利に使わせてもらいました。ご指摘有難うございます。Thankyouですはじめまして。マウスオーバー時画像変更のソースを探して一番にここへたどりつき、参考にさせていただきました。ありがとうございました。ところで「マウス操作で画像を変更(簡易型)」のソースの一番最後、「"」が抜けているようです。お世話になったついでに一言ご報告です。PONTA@管理人ご指摘有難うございます。「マウス操作で画像を変更(簡易型)」のサンプルと記載コードが食い違っていましたので修正しました。正しくは「name="画像ID"」が不要で「document.画像ID.src」が「this.src」となります。全コメントを見る[13件]©2004-2011::無料ホームページ素材作成ならGIFアニメ工房で!。