colpick js调色板位置

【问题标题】：colpick js color palletee positioncolpick js调色板位置
【发布时间】：2016-09-14 06:07:48
【问题描述】：

我使用 colpick.js 获得了一个调色板。当我单击 div 时，它工作正常。它打开颜色框。但是当我滚动页面时保持框打开它不会随着页面滚动。它总是保持在滚动区域中的位置。只是它随着卷轴上下移动。有人可以帮忙吗？

$(".colorCircle").colpick({
                color: '#212125',
                colorScheme: 'dark',
                layout: 'hex',
                submit: 0,
                onChange: function (hsb, hex, rgb, el, bySetColor) {
                    $(el).css('background-color', '#' + hex);
                    $(el).attr('colCode', '#' + hex);
                    $(el).value = "";
                }
            }).keyup(function () {

                $(this).colpickSetColor(this.value);

            });

【问题讨论】：

它的 CSS 可能是 position: fixed;。尝试将其更改为position: absolute;。或者不要担心这种极端情况。

标签： javascript jquery html css color-picker

【解决方案1】：

在您的colpick.css 中，确保.colpick 类的position 属性设置为position: absolute;（如果未设置）。以防万一它已经有这个，然后检查你的其他 CSS 文件，你可能会覆盖这个样式。

colpick 库的 .colpick 类通常看起来像，

.colpick {
    position: absolute;
    box-sizing:content-box;
    width: 346px;
    height: 170px;
    overflow: hidden;
    display: none;
    font-family: Arial, Helvetica, sans-serif;
    direction:ltr;
    background:#ebebeb;
    border: 1px solid #bbb;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;

    /*Prevents selecting text when dragging the selectors*/
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
}

希望这会有所帮助！

【讨论】：