上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
この前、Pythonに手を出したばかりだけれど今度はJavaScriptを新しく勉強し始めました。
理由は下記の3つ。
・一応、クロスプラットフォーム(ブラウザに依存するけど…)
・ブラウザがあれば、どこでもできる。
・ブログに記事を書いたときに、すぐ体感できる。

というわけで、今回は見た目的にもすぐわかる画像切替のJavaScriptを書いてみました。
下の画像にマウスカーソルを乗せると画像が変わります。

画像切替


ソースコードは下記通りです。
<span onmouseover="document.画像ID.src='変更画像URL';"
onmouseout="document.画像ID.src='元画像URL';">
<img name="画像ID" alt="代替テキスト" src="元画像URL" >
</span>

今回はJavaScriptの機能を使っただけなので、あんまりプログラミングっぽくないですね;

参考にしたサイト様
GIFアニメ工房マウスオーバー画像変更スクリプト


余談
勉強のために買った参考書に書いてある通りでは、うまく動かなかった(´・ω・)
Comment
Trackback













管理者にだけ表示を許可する

Comment form

openclose

カテゴリ一覧

そま宗助

  • Author:そま宗助
  • タイ生まれのちょっと変な?日本人。
    農学博士の父とブラジル日系1世の母の間に生まれたため、普通の日本人とはちょっと違う視点で世界を見つめる男。

    最近、勉強会やカンファレンスにちょいちょい顔出ししてます。

    読書週間継続中?

    ストレングスファインダー
    1.収集心
    2.学習欲
    3.共感性
    4.指令性
    5.運命思考
プロフィール

※注意書き※
当ブログに掲載されているJavaScriptの動作確認はFirefoxでのみ行っております。他ブラウザでの動作に関しては保障できませんのでご注意ください。






1キロバイトの素材屋さん
フリーエリア
FC2カウンター

名前:
メール:
件名:
本文:

メールフォーム

Page Top

Powered by FC2 Blog |

FC2Ad

| Template Design by スタンダード・デザインラボ

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