JavaScript - ブラウザオブジェクトモデル(タイマー(setInterval, clearInterval))

初めてのJavaScript 第2版
Shelley Powers (著)
武舎 広幸、武舎 るみ (訳)

開発環境

• OS X Lion - Apple(OS)
• Safari (Webプラウザ)
• BBEdit - Bare Bones Software, Inc.(Text Editor)
• Script言語:JavaScript
• JavaScript Library: jQuery

『初めてのJavaScript 第2版』(シェリー・パワーズ著(Shelley Powers著)、武舎 広幸+武舎 るみ訳、オライリー・ジャパン、2009年、ISBN978-4-84312-225-5) の9章(ブラウザオブジェクトモデル)練習問第9-3を解いてみる。

その他参考書籍

• JavaScript 第6版
• JavaScriptリファレンス 第6版
• JavaScriptクックブック
• 『jQueryクックブック』(jQuery Community Experts 著、株式会社クイープ 訳、オライリー・ジャパン、2010年、ISBN978-4-87312-269-3)

9-3.

コード(BBEdit)

<input id="start_slide" type="button" value ="開始" />
<input id="stop_slide" type="button" value="一時停止" />
<br /><br />
<img id="slide" alt="スライドショー" />
<script>
var tm;
var pics = [
             "http://farm9.staticflickr.com/8465/8347011347_03661d6af2_m.jpg",
             "http://farm8.staticflickr.com/7016/6504882499_4ef93d1a45_m.jpg",
             "http://farm9.staticflickr.com/8424/7757420986_d316f967ed_m.jpg",
             "http://farm8.staticflickr.com/7261/7406369886_1a82c8c5c0_m.jpg",
             "http://farm5.staticflickr.com/4032/5120980604_130500eb87_m.jpg"
           ];
var currentPhoto = 0;
function f(){
  $('#slide').attr('src', pics[currentPhoto]);
  currentPhoto = currentPhoto === 4 ? 0 : (currentPhoto + 1);
}
function start(){
  tm = setInterval(f, 5000);
}
function stop(){
  clearInterval(tm);
}
$('#start_slide').click(start);
$('#stop_slide').click(stop);
</script>