JScrollPane: remove scrollbar?

I would like the scroll bar to be placed above the content, and not make it stand next to it.

In the attached image, you can see what it is doing with the red scroll bar now ... it creates a vertical gutter that pushes the content to the side.

But what I want to do is what is below ... there is a scroll bar located above the content.

I tried absolutely positioning .jspVerticalBar, but I could not get rid of the gutter.

enter image description here

EDIT: Here's the jsFiddle problem: http://jsfiddle.net/8Mebt/3/ - As you can see, there is still a space in the far right corner and the "selected" state of the item does not propagate the way I want.

+5
3

.jspVerticalBar . right , ,

.jspHorizontalBar, .jspVerticalBar, .jspTrack {
    background: none repeat scroll 0 0 transparent;
}

(, jscrollpane) .

http://jsfiddle.net/gaby/DsDQP/


( jsfiddle) .

verticalGutter 0 jspPane, jspTrack.

$('.scroll-pane').jScrollPane({verticalGutter:0});
$('.jspPane').css({width:'+=' + $('.jspTrack').width()});

demo at http://jsfiddle.net/gaby/DsDQP/8/

.

, jspPane () javascript, verticalGutter .jspTrack. CSS !important , javascript, @Evgeny .

+7

verticalGutter jScrollPane, , - .

$('.scroll-pane').jScrollPane({verticalGutter:-100})

http://jsfiddle.net/DsDQP/50/

+6

.....

    //Should it (the #parentContainer) have had a "scroll-pane" class

        $('#parentContainer').jScrollPane()

    $.each(data, function(i, value) {

//Detach scrolling capabilities
        $('#parentContainer').jScrollPaneRemove();

        $('<div/>',{
        class:'anyClass',
        id:'anyId'
        })
        .appendTo(#childContainer);

//Return back Scrolling capabilities to the parent container    
        $('#parentContainer').jScrollPane();            


        ///-> Loop Ends
                });

, . , ScrollBar .

, ...

Ebest

0

All Articles