Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>JS Bin</title>
    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css">
    <script src="//code.jquery.com/jquery-1.10.2.js"></script>
    <script src="//code.jquery.com/ui/1.11.2/jquery-ui.js"></script>
    <script>
        $(function () {
            $("#slider-range").slider({
                range: true,
                min: 26,
                max: 388,
                values: [ 26, 388 ],
                slide: function (event, ui) {
                    $("#amount").val(ui.values[ 0 ] + " и до " + ui.values[ 1 ]);
                }
            });
            $("#amount").val($("#slider-range").slider("values", 0) +
                    " и до " + $("#slider-range").slider("values", 1));
        });
    </script>
</head>
<body>
<div class='form'>
    <div class='form-living'>
        <div class='living-header'>
            Жилая <br/>недвижимость
        </div>
    </div>
    <div class='form-commercial'>
        <div class="commercial-header">
            Коммерческая <br/>недвижимость
        </div>
    </div>
    <div class="form-content">
        <form action="handler.php">
            <div class="content-rooms">
                Кол-во комнат <label>
                <input type="radio" name="radio">1</label>
                <label><input type="radio" name="radio">2</label>
                <label><input type="radio" name="radio">3</label>
                <label><input type="radio" name="radio">4</label>
                <label><input type="radio" name="radio">Студия</label>
            </div>
            <div class="content-disctict">
                Район
                <select>
                    <option>Пункт 1</option>
                    <option>Пункт 2</option>
                </select>
            </div>
            <div class="content-object">
                Объект
                <select>
                    <option>Пункт 1</option>
                    <option>Пункт 2</option>
                </select>
            </div>
            <div class='slider'>
                <label for="amount">Площадь от:</label>
                <input type="text" id="amount" readonly style="border:0; color:#f6931f; font-weight:bold;">
​
                <div id="slider-range"></div>
            </div>
          <div class="content-submit">
            <button id='submit'>Подобрать</button>
          </div>
         </form>
    </div>
</div>
</body>
</html>
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers