ホームページを作る人のネタ帳

Ajaxでおしゃれな小窓を作る6つのサンプル

ウィンドウ
これはなかなかおしゃれな小窓が作れそう。

ウェブサイトでちょっとしたお知らせなどを入れる時に役に立つと思います。
特に、フォームを利用しただけではあまりおしゃれなものになりませんので、この技術を応用してみてはいかがでしょうか。

6つのサンプル


試しにサンプルファイルを開いてみれば、一通り使えると思いますよ。

サンプル1

マウスによるロールスクロールは出来ない。
矢印にマウスを乗せるとスクロールする。


サンプル2

スクロールバーを左に配置。ボタンデザインをこったものに出来るサンプル。


サンプル3

スクロールバーを右に配置しているが、特殊なバーに加工している。


サンプル4

上のサンプル3に、タブを追加したバージョンです。


サンプル5

上のサンプル4に、さらに右側にリンクによるナビゲーションを追加したバージョン。
リンクナビゲーションをクリックすると、中のスクロールもそこまで移動するという代物。


サンプル6
200707162029.gif
上記サンプルの技術をつかった美しいサンプル。


ダウンロード


jsScrolling
こちらから移動し、『jsScrolling.zip』をクリックすればダウンロードできます。

ウィンドウ
ダウンロードしたファイルには、jsファイルが入っており、これらを呼び出すことで使用できます。

是非勉強ついでにダウンロードしてみるといいかもしれませんね。
@yamada_nt
Posted by@yamada_nt
スポンサードリンク

Comments 0

There are no comments yet.

Leave a reply