ホーム > タグ > Ajax

Ajax

[mootools]slideBox ver1.0をマウスホイールに対応させる

スクロールバーをカスタマイズ出来るmootools依存のライブラリslideBoxを、マウスホイールでも動くよう適当に変更してみた。
デフォルトだと矢印のクリックでスクロールするんだけど、
基本的なスクロール量は表示エリアの高さ(class-wrapper)と同じだから、マウスホイールで微調整したくなる場合もある。

使い方はファイル落とせば分かると思うので省略。

オプションは次の通り

JavaScript:
  1. options: {
  2.     className:'slide',      // スライドするエリアのクラス名
  3.     prevArrow:'-previous',    //前にスライドする矢印の接尾語
  4.     nextArrow:'-next',    // 後にスライドする矢印の接尾語
  5.     removeArrows:true,    //先頭と最後にスクロールしたとき矢印消すかどうか
  6.     fadeArrows:false,         // 矢印にフェードエフェクトつけるかどうか
  7.     startOpacity:0.5,         //フェードエフェクトがスタートした時の矢印の透明度
  8.     endOpacity:1,         //フェードエフェクトが終わった時の矢印の透明度
  9.     mouseoverBox:true,    //スライダー内にあるULとLI要素にクラスを追加するかどうか
  10.     startClass:'normal',        // マウスアウト時に追加するクラス名
  11.     endClass:'over',            //マウスエンター時に追加するクラス名
  12.     speed:5,                //スクロールスピード(10:fast 1:slow)
  13.     transition:Fx.Transitions.Quart.easeOut //スクロールのトランジション効果
  14. },

カスタマイズ部分のソースのみ掲載してます。

Continue reading

Immortal Cities:Nile Online

NileOnlineは名前の通り古代エジプトが舞台の都市建設シュミレーション。ブラウザだけで遊べる。
ソース元は4亀です。
都市建設シムに目が無いので即登録してみた。

Immortal Cities:Nile Online

ブラウザで遊べるゲームはFlashが多いけど、このゲームはAjaxでした。
使われてるフレームワークはprototypescriptaculous、画面はXHTMLなのでAjax勉強中なら参考になることは多いかもしれない。
もしFireFoxで遊ぶならFireBugはOFFの方がいいです。

対応ブラウザはFirefox, Opera, IE8, Safari, Chrome。
色々と足引っ張るIE6はおろか7すら切るとは潔い。

以下、適当な説明。

Continue reading

 Page 3 of 3 « 1  2  3 

Home > Tags > Ajax

最近の投稿
最近の修正
  • そしてこのSQLはわれながらよく書いたと思う 2010-11-15
  • CSVの列っていう方がいいのかな…118項目だった 2010-11-15
  • 楽天のCSVの項目が116個もあった衝撃 2010-11-15
  • オフィスで香水臭振りまくのは迷惑だと知れ 2010-11-15
  • ぐあー フレグランステロやー 2010-11-15
  • More updates...

Powered by Twitter Tools

Tag Cloud
おすすめサーバー・他
メタ情報

Return to page top