Search code examples
javascriptjqueryjquery-uijquery-ui-slider

jquery ui slider. Help to correct please


help please to fix my problem. i am newby in jquery ui. And have tried to create jquery slider: http://jsfiddle.net/InviS/LYE8B/4/ But it outstep my in right position (see example). how can i limit the slider?


Solution

  • Here you go: http://jsfiddle.net/NAC7b/10/.

    It's a bit hacky, but I wrap the slider within a parent <div>, and give the slider a max-width of 93%. Here's my changed CSS:

    #wrapper{
        width: 100%;
        height: 20px;
        background-color: orange;
        border-top: 1px solid black;
        position: absolute;
        left: 0;
        top: 129px;
    }
    
    #scroll{
        width: 93%;
        height: 20px;
        background-color: orange;
        border-top: 1px solid black;
        position: relative;
        left: -1px;
        top: -1px;
    }
    

    And JavaScript:

    $('#scroll').slider({animate: true}).bind('slidestop',function(e,ui){
        //alert(ui.value);
    }).wrap('<div id="wrapper" />');