| ページ一覧 | ブログ | twitter |  書式 | 書式(表) |

MyMemoWiki

JavaScript 画像の切替

提供: MyMemoWiki
2020年2月15日 (土) 07:33時点におけるPiroto (トーク | 投稿記録)による版 (ページの作成:「==JavaScript 画像の切替== {{ref imageUpdate.lzh}} <html> <head> <script> var close_normal_img = new Image(); close_normal_img.src = "./close_norma…」)
(差分) ← 古い版 | 最新版 (差分) | 新しい版 → (差分)
ナビゲーションに移動 検索に移動

JavaScript 画像の切替

テンプレート:Ref imageUpdate.lzh

<html>
<head>
<script>
  var close_normal_img  = new Image();
  close_normal_img.src  = "./close_normal.jpg";
  var close_over_img    = new Image();
  close_over_img.src    = "./close_over.jpg";

  var fld_open_img      = new Image();
  fld_open_img.src      = "./fld_open.jpg";
  var fld_close_img     = new Image();
  fld_close_img.src     = "./fld_close.jpg";

  function openFolder(img, fldId) {
    var fld = document.getElementById(fldId);
    
    if (fld.style.display == 'block') {
        fld.style.display = "none";
        img.src = fld_close_img.src;
    } else {
        fld.style.display = "block";
        img.src = fld_open_img.src;
    }
  }
  function closeImgUpdate(img, isMouseOver) {
    if (isMouseOver) {
        img.src = close_over_img.src;
    } else {
        img.src = close_normal_img.src;
    }
  }
</script>
</head>
<body>
      <img src="./fld_close.jpg" onclick="javascript:openFolder(this,'fld_div');">
</body>
</html>