角丸幅可変ボタンでクロスフェードをする

角丸の幅可変ボタンを作ろうと思うと割と面倒くさいんですけど
さらにクロスフェードさせたい（実質クロスフェードではないんですが）
という欲望に負けてやってみました。

ちょっと前に流行った？アコーディオンメニューの開閉状態を
Cookieで保存する方法をメモをかねて紹介します。

ひと味違ったページ内スクロールをjQuery Easingプラグインで実装する jQuery.easing.scroll.js

jQueryを使うとかなり簡単にページ内スクロールが実装できるのですが、さらにjQuery Easingプラグインと合わせるとなかなか面白い動きができたりします。

というわけで誰でも簡単に導入できるようにプラグインにしました。以前にslideScroll.js(jQueryプラグイン版）というページ内スクロールの記事を書きましたが、悲しいことに断然こちらのほうがおすすめです。動きが滑らか…そして自分の好きな動きから選べます。

今回はソースの解説もしてるので、興味のある人は見てみてください。

ページ内スクロールプラグインなのに、7KBもあるのはEasingプラグインの容量が5KBだから…これを機に他のアニメーション部分でもEasingプラグインも使うと一石二鳥になったりしますのでぜひ。

サンプルのセレクトボックスでEasingを選んで右の入力欄にDurationを入れて確認できます。
そもそもEasingが何かわからない人も、とりあえず左のセレクトボックスの値を変えて、右のテキストボックスには800あたりを入力して、中央のナビゲーションリンクをクリックしてみてください。

おすすめをちょっとあげてみます。（右の数字はDuration）

具体的な動きの違いはjQuery日本語リファレンスのEasingページで確認できます。

もう先週の火曜日になるのですが、CSS Nite in OSAKA, vol.14に参加させていただきました。
そうです、この記事、今更感がいなめません…WordPressの記事を書く前にこっちを書けよという声が…

言い訳としては、WordPressの記事、あれは2日くらい前からの予約投稿だったんですね。
あ、こっちを予約しとけよ、という話ですかｗ

とにかくスタッフの皆様、僕のセッションを見てくださった方、お疲れ様でした・ありがとうございました！
反省する点もいろいろとありましたが、非常にいい機会になりました。なにより楽しかったです。

淡々と話をしているように見えたかもしれませんが、僕の中では色々な盛り上がりなどがあったんですｗ
その後の懇親会では印象が違いますね、と言われたりもしました…まったくそのとおりです笑

CSS Niteのフォローアップ記事からも見れますが、当日のスライドのリンクを残しておきます。

ついでにjQuery.validation.jsの記事も…

jQuery.validation.js

一部対応が遅くなってしまいましたが、修正・更新をしました。
前回まではjQuery1.2.6を同梱してましたが、今回から1.3.2を同梱してます。
主な修正・更新箇所は以下になります。