たまにはマッシュアップなるものを −その5−
- 今日の変更点
- 天気予報(今日、明日、明後日)の地域の切り替えをタブ化してみる(とりあえず見た目だけ)
デフォルトは中通り
- 天気予報(今日、明日、明後日)の地域の切り替えをタブ化してみる(とりあえず見た目だけ)
CSSでクールなタブUIを作成するサンプル:phpspot開発日誌を参考に作成
ようは、〈ul〉〈li〉〈/li〉〈/ul〉でリストを作成して、cssと画像でタブのようにみせると、で、idがcurrentの場合、選択状態になるってことです
が、タブをクリックしたときに選択状態にするのが載ってなかったので、
function test(obj){ Weather_Dsp(obj); $("current").removeAttribute('id'); if (obj == "33") { document.getElementsByTagName("li")[0].setAttribute('id' ,'current'); } else if (obj == "31") { document.getElementsByTagName("li")[1].setAttribute('id' ,'current'); } else { document.getElementsByTagName("li")[2].setAttribute('id' ,'current'); }
<ul class="obtabs"> <li class="tab1" class="first" ><span><a href="#" onclick="test(33);">会津地方</a></span></li> <li class="tab2" id="current"><span><a href="#" onclick="test(31);">中 通 り</a></span></li> <li class="tab3"><span><a href="#" onclick="test(32);">浜 通 り</a></span></li> </ul>
idの付け替えなんかでごまかしているが、これでいいのかなぁ?(ソースの汚いのは途中なので…)