Edited at

Evol-ColorPicker.js ちょっとだけ幸せになる修正

More than 1 year has passed since last update.

カラーピッカーのUIとして優秀なEvol-ColorPickerですが、jQuery.UIのDatePickerと比べるとポップアップ位置がちょっと残念です。

そこで、evol-colorpicker.js_downOrUpPositioning()の一部をイジイジします。

evol-colorpickerのポップアップ時

jQuery.UI.datePickerのポップアップ時


evol-colorpicker.js(line-336あたり)


_downOrUpPositioning: function() {
var el = this.element,
i = 0;
while (el !== null && i < 100) {
// Look up the first parent with non-visibile overflow and compute the relative position
if (el.css('overflow') != 'visible') {
var bott = this._palette.offset().top + this._palette.height(),
pBott = el.offset().top + el.height(),
top = this._palette.offset().top - this._palette.height() - this.element.outerHeight(),
pTop = el.offset().top,
openUp = bott > pBott && top > pTop;
if (openUp) {
this._palette.css({ bottom: this.element.outerHeight()+'px' });
} else {
this._palette.css({ bottom: 'auto' });
}
break;
}
if (el[0].tagName == 'HTML') break;
else el = el.offsetParent();
i++;
}
this._palette.css({ left: this.element.offset().left + "px" }); /////追加行/////
},


evol-colorpicker.min.jsを以下で検索して

if("HTML"==a[0].tagName)break;a=a.offsetParent(),b++}}



これで置換

if("HTML"==a[0].tagName)break;a=a.offsetParent(),b++}this._palette.css({left:this.element.offset().left+"px"})}


修正後のポップアップ時の様子

すっきり(*´ー`*)