2006年10月04日

イメージでdivの表示・非表示を切り替える

今回は、サンプルでもよくDLされている、イメージでdivの表示・非表示を切り替える方法をこちらにはってみます。
イメージをクリックすると指定しているDiv内(ここではid指定)の表示状態をDivタグスタイル属性を変更し、非表示にしたり表示に戻したりしています。
このブログTOPの左下の「サンプルブログパーツ」にも適応してみました。こんな感じで利用するのも一つの手かもしれませんネ。
なお、ネスケの古いヴァージョンなどでは、getElementByIdが利用できませんのでdocument.layers["div名"]で呼び出してくださいね。他のヴァージョンとの互換性など、レイヤー全般に関するサンプルはうさのJavaScript講座のサンプル集8でご紹介しております。

←クリックしてみてネ♪
この部分がDIV内です。

ソースはこちら↓

2006年10月02日

id値をテキストボックスに表示

週末ふらっと海外で潜ってまいりました。(実はダイブマスターだったりするうさです。)
普段よくボーイング747に乗るのですが、今回は757。行きはエコノミー(コーチ)で帰りはビジネスだったので、その座席配列をマウスイベントで表現してみることにします。

サンプルでは、テキストにAタグを貼り、そのid値をテキストボックスに表示させています。AタグでなくてDIVタグなどでも動作します。ただし、テキストボックスに表示する場合、特に古いヴァージョンのブラウザなどgetElementById関数を利用できないブラウザもありますので、その場合は、"document.フォーム名.テキストボックス名"にてご利用くださいませ。フォームに関するサンプルは、うさのJavaScript講座のサンプル集4に入っています。

 

 


ソースはこちら↓

2006年09月21日

本日日付を画像で表示☆サンプル集1-69を追加しました

本日日付を画像で表示☆サンプル集1-69を追加しました。
もともとサンプル集1-7に入っていたのですが、最近のブラウザではgetYearでなくgetFullYearで年度を取得するので、その1行を変更したものです。サンプルはそのままHTML/XHTML内部にも記述できますし、JSファイルにしていただいても結構です。ご自由にカスタマイズしてくださいませ。
ブログにももちろん使えますのでご利用くださいね♪

うさのJavaScript講座・サンプル集1-69をこのページに貼り付けています。

ソースはこちら↓

2006年09月05日

ブログにもJavaScriptを♪ おみくじ編

こんにちは。@うさ
ブログでももちろんJavaScriptが使えるということで、サンプル集の一部からブログに貼り付けてお送りします。
今回は本日サンプルを復旧させましたサンプルの中から、ここにおみくじをはってみました。サンプルでは投函本文にありますが、左や右のブログパーツ部分にいかがでしょうか?Script内部は配列になっていますのでいくつでも画像を準備していただけます。
おためしあれ♪





ソースはこちら↓

ブログにもJavaScriptを♪ おみくじ編の続きを読む