Question

有关如何在div .handle上拖动div .slider并在此时获取值的任何提示？提前谢谢。

HTML

<html>
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <title>Drag to see price</title>
        <meta name="description" content="En interaktiv genomgång av Brackets.">
        <link rel="stylesheet" href="stylesheet.css">
    </head>
    <body>
        <div class="slider"></div>
        <div class="handle"></div>
    </body>
</html>

CSS

.slider{
    background-color: black;
    width: 500px;
    height: 15px;
}

.handle{
    background-color: red;
    position:absolute;
    left: 12px;
    top: -0px;
    width: 56px;
    margin-left: -10px;
    height: 32px;
    z-index: 3;
    cursor: pointer;
}

Answer 1

如果您只是为了迎合IE9及更早版本，请考虑使用HTML5输入：

enter image description here

＆＃13;

$("#test").on("input change",function(){
  $("#bleh").text($(this).val())
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="test" type="range"/>
<p id="bleh"></p>

＆＃13;

否则，您可能必须实施自己的解决方案或使用Modernizr

之类的内容

拖动以更改值

1 个答案: