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

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

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

オプションは次の通り

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 //スクロールのトランジション効果
},

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

続きを読む

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すら切るとは潔い。

以下、適当な説明。

続きを読む

SlimBBS ver1.0

1行レスタイプの掲示板作ってみた。 The RoomさんとこのOneLineBBSを参考にしました。 名前と本文だけなのでチャットっぽい使い方も出来るかもしれない。 ファイルサイズ小さいので携帯でも使えるかもしれない。( … 続きを読む

[bg]CSS用ドロップシャドウ背景 8ColorPack(パステル系)

コンテンツ部分の両端にドロップシャドウを付ける、repeat-y用の背景画像をまとめたパッケージです。 パステル調の8色セット。コンテンツエリアはwidth:900pxです。 サンプルページ フリー素材です。色変更、サイ … 続きを読む

[WP]カスタムフィールドの値で記事を並び替える

質問された、カスタムフィールドで設定した値で記事を並び替えて表示するサンプルを晒してみる。
オススメ度とかでランキングっぽいことしたい時に使えるのか・・・な?
やってることはarray_multisortによる多次元配列のソートです。

サンプル関数の使い方は次の通りです。

  1. 記事にソート用のカスタムフィールドを作成
  2. 10進数の半角数字で値を入力
  3. テンプレートの表示したいところにサンプルのコードを入れる

以上。
サンプルソースは用途に応じて適当に変更するといいと思います。

参考ページ

追加

  1. 他のカスタムフィールドも表示したい場合
  2. ページナビゲーションによる分割表示

続きを読む

[PHP]闇鍋ジェネレーター

オンラインで闇鍋! はいはいはいはい、意味あんの?とか言わないそこ。 直接見る 登録された具材からランダムで1つ選んで表示。 選ばれた具材は都度削除されていくって仕組みです。 パスワードはpassです ランダムで何かする … 続きを読む