如何旋转180度

Question

我实现了光谱颜色选择器 。 我正在尝试将.alphaSlider旋转180度。 当然，我可以使用CSS来做到这一点（使用transform: rotate(180deg) ），但这有点像hack，而且总会有其他问题。 我想用JavaScript源文件来做。

如何编辑源文件，以便可以旋转180度.alphaSlider ？

以下是相关代码：

来源：（行：387-395）

draggable(alphaSlider, function (dragX, dragY, e) {
    currentAlpha = (dragX / alphaWidth);
    isEmpty = false;
    if (e.shiftKey) {
        currentAlpha = Math.round(currentAlpha * 10) / 10;
    }
    move();
}, dragStart, dragStop);

资料来源：（行：1068-1073）

var t0 = e.originalEvent && e.originalEvent.touches && e.originalEvent.touches[0];
var pageX = t0 && t0.pageX || e.pageX;
var pageY = t0 && t0.pageY || e.pageY;

var dragX = Math.max(0, Math.min(pageX - offset.left, maxWidth));
var dragY = Math.max(0, Math.min(pageY - offset.top, maxHeight));

Answer 1

繁荣！ 做完了 参见jsfiddle。 （摘录不允许我发布所有代码。）

• 红色选择器使用水平法线
• 蓝色使用垂直法线。
• 绿色使用水平翻转。
• Aqua使用垂直翻转。

尚未在IE中进行测试。

http://jsfiddle.net/4z7d6ze5/2/

这样称呼：

$(document).ready(function() {
    $("#custom").spectrum({
        color: "#FF0000",
        showAlpha: true
    });
    $("#custom2").spectrum({
        color: "#0000FF",
        showAlpha: true,
        alphaVertical: true
    });
    $("#custom3").spectrum({
        color: "#00FF00",
        showAlpha: true,
        flipAlpha: true
    });
    $("#custom4").spectrum({
        color: "#00FFFF",
        showAlpha: true,
        flipAlpha: true,
        alphaVertical: true
    });
});