@Webhouse Japan Home Page

E-mail webhouse@japan 　

JavaScript

 _

　マウスで拡大画像表示

 _Back　_TopPage　_Next

アイコン画像にマウスが乗ると拡大画像を表示

  • 1枚の画像を、サイズを変えて表示させているスクリプトです。
  • 使用する画像は、同じサイズにします。1ピクセルでもサイズが異なると、表示する時にスムーズに切り替わりません。（縦横比も保って下さい。）
  • 小さく表示する方の画像のサイズ及び縦横比は問いません。
  • ページ読み込み時に、切り替えで使用する画像をすべてロードするので、画像サイズは大きすぎない方がよいでしょう。

    • ◆せっかくのホームページですから、両方のWebブラウザで確認するのがベスト！ですネ！！


    マウスがアイコンの上にに乗ると？

    ■JavaScriptサンプルテキスト
    下記テキストBox内を全てコピーしてご利用下さい。


    「記入例」
    ●JavaScript命令に拡大表示する画像を指定します。
    　　movimg[0] = new Image();movimg[0].src='    img/photo1.jpg';

    ●ページに最初に表示する拡大画像を設定します。
    　　　<IMG SRC="    img/photo1.jpg" ALIGN="BOTTOM"WIDTH="190" HEIGHT="191">

    ●アイコン画像とサイズ・クリックした場合のリンク先を設定します。
    　　　<A HREF="    img/win1.html"TARGET="_blank" onMouseOver="changImg1(0,0)">
    　　　<IMG SRC="    img/icon1.jpg"
    　　　　　　WIDTH="32" BORDER="0" ALIGN="BOTTOM" HEIGHT="32">
    　　　　</A>

    ■各テキストの設定・数値を変えて試してください。
    ■設定時間毎にパラパラと画像を自動で変え表示する方法は    こちらから....。

    Copyright (c) Webhouse Japan /