小编Sho*_*lam的帖子

将Hsl转换为rgb和hex

我需要一个颜色转换器从hsl转换为rgb和十六进制值.我会像这样做.我正在使用jquery和jquery ui range slider.这是我的代码:

$(function() {
    $( "#hsl_hue_range" ).slider({
        min: 0,
        max: 100,
        value: 0,
        range: false,
        animate:"slow",
        orientation: "horizontal",
        slide: function( event, ui ) {
            var hsl_hue = ui.value;
        }
    });
});

$(function() {
    $( "#hsl_saturation_range" ).slider({
        min: 0,
        max: 100,
        value: 0,
        range: false,
        animate:"slow",
        orientation: "horizontal",
        slide: function( event, ui ) {
            var hsl_saturation = ui.value;
        }
    });
});

$(function() {
    $( "#hsl_light_range" ).slider({
        min: 0,
        max: 100,
        value: 0,
        range: false,
        animate:"slow",
        orientation: "horizontal", …

Run Code Online (Sandbox Code Playgroud)

javascript jquery color-picker colors converter

Sho*_*lam

lucky-day

6
推荐指数

5
解决办法

1万
查看次数

使用 5 个步骤平滑 jquery Ui 滑块

我正在开发一个项目，其中有几个 jq UI 滑块。我有一个特殊的，只有 5 个步骤。这是小提琴，这是片段（第一个小提琴和片段）：

$(function() {
    $( "#slider" ).slider({
        min: 1,
        range: false,
        max: 5,
        value: 1,
        animate:"slow",
        orientation: "horizontal",
        slide: function( event, ui ) {
            $(".value").text("slider value: " + ui.value);
        }
    });
});

Run Code Online (Sandbox Code Playgroud)

body {
    padding: 0px;
    margin: 0px;
    background-color: #333;
    color: #FFF;
    font-family: arial;
    font-size: 20px;
}
.slider-holder {
    padding: 15px;
    margin: 0px;
}
.value {
    margin: 15px 0px 0px 0px;
    display: inline-block;
}

Run Code Online (Sandbox Code Playgroud)

<html>
<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
  <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
</head> …

Run Code Online (Sandbox Code Playgroud)

javascript jquery jquery-ui slider uislider

Sho*_*lam

lucky-day

2
推荐指数

1
解决办法

7218
查看次数