javascript: 2009年7月まとめ

案外簡単に取得できる。1行スクリプト。

サンプル

トグルスイッチ。スイッチですね。入れたり切ったり。onとoff。

サンプル

行末の全角 or 半角のスペースを削除

今日一日はまった。。

関数を呼び出す形の場合、ie系(ie6、7、8)だとOnMouseOutとかOnClickが動かない。。よって関数を呼び出さない、下記の方法へ変更。

  • imgタグには↓のようにnameを指定する。
    <img src="/img/menu00.jpg" usemap="#MC" name="MapChange" border="0" /></
    nameを指定しないとsafariなど一部ブラウザで動作しません。

↓この画像4つを今回は使用する。

実行サンプル

<script type="text/javascript">

function MapLoad() {
  Img01 = new Image();
  Img01.src = "/img/menu01.jpg";

  Img02 = new Image();
  Img02.src = "/img/menu02.jpg";

  Img03 = new Image();
  Img03.src = "/img/menu03.jpg";
//↑↑↑画像を事前に読み込む
}

</script>
<div onload="MapLoad()"><img src="/img/menu00.jpg" usemap="#MC" name="MapChange" border="0" /></div>
<map name="MC">
  <area onmouseover="MapChange.src='/img/menu01.jpg'" onmouseout="MapChange.src='/img/menu00.jpg'" shape="rect" coords="0,0,120,40" href="http://www.google.co.jp/" />
  <area onmouseover="MapChange.src='/img/menu02.jpg'" onmouseout="MapChange.src='/img/menu00.jpg'" shape="rect" coords="121,0,240,40" href="http://www.google.co.jp/" />
  <area onmouseover="MapChange.src='/img/menu03.jpg'" onmouseout="MapChange.src='/img/menu00.jpg'" shape="rect" coords="241,0,360,40" href="http://www.google.co.jp/" />
</map>

ウィンドウとbodyタグの高さを取得するサンプル。ブラウザの大きさの変化に対応できるようにするためにメモ。

[javascript]bookmark 表示領域 サイズ取得

あわせて読みたいブログパーツ