ホーム > タグ > Ajax
Ajax
[mootools]slideBox ver1.0をマウスホイールに対応させる
- 2008-10-30 (木)
- MooTools
スクロールバーをカスタマイズ出来るmootools依存のライブラリslideBoxを、マウスホイールでも動くよう適当に変更してみた。
デフォルトだと矢印のクリックでスクロールするんだけど、
基本的なスクロール量は表示エリアの高さ(class-wrapper)と同じだから、マウスホイールで微調整したくなる場合もある。
使い方はファイル落とせば分かると思うので省略。
オプションは次の通り
JavaScript:
-
options: {
-
className:'slide', // スライドするエリアのクラス名
-
prevArrow:'-previous', //前にスライドする矢印の接尾語
-
nextArrow:'-next', // 後にスライドする矢印の接尾語
-
removeArrows:true, //先頭と最後にスクロールしたとき矢印消すかどうか
-
fadeArrows:false, // 矢印にフェードエフェクトつけるかどうか
-
startOpacity:0.5, //フェードエフェクトがスタートした時の矢印の透明度
-
endOpacity:1, //フェードエフェクトが終わった時の矢印の透明度
-
mouseoverBox:true, //スライダー内にあるULとLI要素にクラスを追加するかどうか
-
startClass:'normal', // マウスアウト時に追加するクラス名
-
endClass:'over', //マウスエンター時に追加するクラス名
-
speed:5, //スクロールスピード(10:fast 1:slow)
-
transition:Fx.Transitions.Quart.easeOut //スクロールのトランジション効果
-
},
カスタマイズ部分のソースのみ掲載してます。
- Comments: 0
- Trackbacks: 0
Immortal Cities:Nile Online
- 2008-10-30 (木)
- Memo
NileOnlineは名前の通り古代エジプトが舞台の都市建設シュミレーション。ブラウザだけで遊べる。
ソース元は4亀です。
都市建設シムに目が無いので即登録してみた。
ブラウザで遊べるゲームはFlashが多いけど、このゲームはAjaxでした。
使われてるフレームワークはprototypeとscriptaculous、画面はXHTMLなのでAjax勉強中なら参考になることは多いかもしれない。
もしFireFoxで遊ぶならFireBugはOFFの方がいいです。
対応ブラウザはFirefox, Opera, IE8, Safari, Chrome。
色々と足引っ張るIE6はおろか7すら切るとは潔い。
以下、適当な説明。
- Comments: 0
- Trackbacks: 0
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
-
- まとめ
- ホームページビルダー
- 擬似クラス
- 楽天
- 1Column
- 2BOX
- 2ch
- 2column
- 2Helvs
- 3column
- 5BOX
- Actionscript
- Ajax
- Animation
- AntiSpam
- API
- apple
- Aptana
- Aqua
- ASCII
- Assets
- AutoExternalLink
- background
- backup
- BETA
- Blog Status
- breadcrumb
- Bubble
- bug
- Button
- calendar
- Calendarizm
- canvas
- Center
- Chain
- Chrome
- Class
- Click Event
- CMS
- ColorMeShopPro
- ContactForm
- Control
- Cookie
- CSS
- CSS3
- CSV
- Custom
- date()
- Demo
- Dojo
- domain
- Download
- Dreamweaver
- dropdown
- Dummy Text
- Effect
- Elastic
- Error
- Filter
- filter.html
- FireFox
- Fixed
- Flash
- Floating
- foglio
- Form
- free material
- free script
- Function Reference
- Fx.Morph
- Fx.Scroll
- Fx.Slide
- Fx.Tween
- Game
- gettext
- get_posts
- GMarker
- Go-To-Top
- GoogleChart
- GoogleEarth
- GoogleMap
- GoogleSearch
- Hack
- Halves
- Highlight
- Horizontal
- HTML&XHTML
- HTML5
- HTML5API
- Icon
- IE
- illustrator
- infowindow
- iphone
- Javascript
- jQuery
- jQuery.plugin
- KML
- LeftMenu
- liquid
- ListMenu
- Localization
- login-system
- Magpie RSS
- Mobile
- mooFollow
- MooTools
- mooTyping
- number format()
- OnlineGame
- OOP
- OpenPNE
- Pagenation
- permalink
- Photoshop
- PHP
- ping
- plugin
- poedit
- Polyline
- prototype.js
- Regular Expression
- RightMenu
- rollover
- RPC
- RSS
- Safari
- Sample
- script.aculo.us
- scrollbar
- selection
- selectors
- SEO
- session
- Shortcode
- Sidebar Widgets
- slimbbs
- Smarty
- SmoothScroll
- strtotime()
- Symphony-CMS
- Tableless
- Tab Menu
- Tar
- Template
- Template Engine
- Template Tags
- time()
- TinyMCE
- token
- Tooltip
- Transparent
- Tutorial
- Tutoriarl
- Valid
- Validator
- vertical-align
- Web Browser
- Web Site
- Wiki
- window.open
- wordpress
- wp-custom
- wp-function
- wp-plugin
- wp-themes
- xampp
- XHTML
- XML
- Xserver
- YUI
- Zend Framework
- Zend_Form
- Zend_View
- zeromail
