作成日: 2020/10/30 最終更新日: 2021/01/27
文書種別
不具合
状況
修正済み
詳細
ブラウザの水平スクロールバーが表示されている状態で、ドロップダウンの月ピッカーを表示すると、月ピッカーが画面の左端に表示されるようにブラウザの画面がスクロールしてしまいます。
回避方法
SpreadJS (Ver.14.0.6)で修正済み。
Ver.14.0.6より前のバージョンでは以下のJavaScriptを追加して回避可能です。
// -----------------------------------------------
// The dropdown types which has problem
var CLASS_MONTH_PICKER_ITEM = 'gc-month-picker-month-item', CLASS_MONTH_PICKER_CONTAINER = 'gc-month-picker-container',
CLASS_TIME_PICKER_ITEM = 'gc-time-picker-li', CLASS_TIME_PICKER_CONTAINER = 'gc-time-picker-container',
CLASS_LIST_PICKER_ITEM = 'gc-list-control-item';
// Record the origin Web API
var _scrollIntoView = HTMLElement.prototype.scrollIntoView;
// Overwrite
HTMLElement.prototype.scrollIntoView = function () {
var element = this;
var className = element.className.split(' ')[0];
var isListItem = className === CLASS_LIST_PICKER_ITEM;
var container;
if (className === CLASS_MONTH_PICKER_ITEM) {
container = document.querySelector('.' + CLASS_MONTH_PICKER_CONTAINER);
} else if (className === CLASS_TIME_PICKER_ITEM) {
container = document.querySelector('.' + CLASS_TIME_PICKER_CONTAINER);
}
if (container) {
var scrollTop = element.offsetTop;
container.scrollTop = scrollTop;
}
if (!container && !isListItem) {
_scrollIntoView.apply(this, arguments);
}
}
// -----------------------------------------------
Ver.14.0.6より前のバージョンでは以下のJavaScriptを追加して回避可能です。
// -----------------------------------------------
// The dropdown types which has problem
var CLASS_MONTH_PICKER_ITEM = 'gc-month-picker-month-item', CLASS_MONTH_PICKER_CONTAINER = 'gc-month-picker-container',
CLASS_TIME_PICKER_ITEM = 'gc-time-picker-li', CLASS_TIME_PICKER_CONTAINER = 'gc-time-picker-container',
CLASS_LIST_PICKER_ITEM = 'gc-list-control-item';
// Record the origin Web API
var _scrollIntoView = HTMLElement.prototype.scrollIntoView;
// Overwrite
HTMLElement.prototype.scrollIntoView = function () {
var element = this;
var className = element.className.split(' ')[0];
var isListItem = className === CLASS_LIST_PICKER_ITEM;
var container;
if (className === CLASS_MONTH_PICKER_ITEM) {
container = document.querySelector('.' + CLASS_MONTH_PICKER_CONTAINER);
} else if (className === CLASS_TIME_PICKER_ITEM) {
container = document.querySelector('.' + CLASS_TIME_PICKER_CONTAINER);
}
if (container) {
var scrollTop = element.offsetTop;
container.scrollTop = scrollTop;
}
if (!container && !isListItem) {
_scrollIntoView.apply(this, arguments);
}
}
// -----------------------------------------------
旧文書番号
86161