スケジュールをブロック表示したとき新規予定追加するスペースの幅を変える方法

YY3ai2ui24 79views 更新:2015年4月22日

スケジュールを読み込んだとき、JavaScriptが呼び出されている。 このJavaScriptがスケジュールのdiv要素のwidth属性を変更している。

具体的には、

aipo/portlets/schedule/src/main/webapp/javascript/aipo/calendar/weekly.js

のaipo.calendar.relocation関数が指定している。 この内、変数offsetW,scheduleDivWidthがdiv要素の属性値を決定する値となっている。

スケジュールの右端に余白を追加して追加用のドラッグ領域を用意するにあたって、筆者は95%と指定したがUI/UXの関係もしくはデバイスごとの対応が必要になった場合は、上記の変数のしかるべき箇所を変更すればよい。

例:「余白なし(列全体の99%で表示)」の状態から「列全体の幅の5%の余白が右端に表示された」状態にする

上記のJavaScriptファイルの813行(2015/04/22現在)のaipo.calendar.relocation関数内の変数を変更する。

before


var offsetW = 0.99; var scheduleDivWidth = 100 / 7;

after


var offsetW = 0.95; var scheduleDivWidth = 95 / 7;

とすればよい。

ログイン / 新規登録してコメントする

このソースコードをストックして後で利用したり、作業に利用したソースコードをまとめることができます。

こちらもお役に立つかもしれません