次のスクリプト http://valums.com/scroll-menu-jquery/ を使用して、水平スクロール カレンダーを作成しました。
これが私がそれを実装した方法です。
http://zifimusic.com/testing/horizontalCalendar.html
私が期待しているカレンダー アクティビティの 90% は、現在の日付から 1 ～ 2 か月以内です。ただし、任意の月を選択できるようにする必要があると思います。私は jQuery の日付ピッカーを使用する予定でしたが、この形式を使用すると、ユーザーは現在選択されている日付を常に表示でき、興味深くもかなりシンプルなインターフェイスで注意が必要な週または日をマークできると考えました。高さは、適切なカレンダーよりもかなり小さくする必要があります。
このようなカレンダーは以前にも見たことがあると思いますが、カレンダーを作成するためのスクリプトが見つかりませんでした。
このカレンダーには 2 つの問題があります。1) 年がページの外にスクロールされるため、何年を見ているのかわかりません。この行を追加しました
var windowWidth=jQuery(window).width();
div.mousemove(関数(e){
jQuery('li.year').each(関数(){
if(jQuery(this).offset().left>0 && jQuery(this).offset().left<windowWidth){
jQuery('h1',this).scrollLeft(offset().left-windowWidth);
しかし、年が表示されたままになり、日付のスクロール内で多少整列するという望ましい効果が得られていないようです。
2）スクロールがちょっと厄介です。ときどき遠くまでジャンプしてしまい、これ以上滑らかなアニメーションを得ることができませんでした。左側のスクロール領域に入ると、スクロールする距離の定義としてウィンドウ オフセットを使用しているため、大きくジャンプします。ユーザーが左右にスクロールしたときにのみアニメーション化する方がはるかに良いと思いますが、それを取得できませんでした。スクロールの移動距離を制限しようとしましたが、カレンダー全体を取得できません。
本当に私が探しているのは、このようなものをスクロールできるようにする最良の方法です。
カレンダーの使用は、実際には個々の日ではなく週を選択するためのものであると言わざるを得ません。これにより、視覚的に週を交互に切り替えて目に見えるグループを作成できるため、この形式がさらに簡単になります。