In html/css hide scroll bar but arrows should work

Question

I want to hide the scroll bar but the overflown data should be accessed with the help of arrows. Can any one help me? Thanks in advance.

There is no easy way to style scroll bar as it's very browser-dependant. Maybe with some JS... — luxcem, Mar 12 '14 at 09:22
This is a very low quality post, but i have a link that might help you. https://github.com/alvarotrigo/fullPage.js — Carl0s1z, Mar 12 '14 at 09:23
You might want to refer this [link](http://stackoverflow.com/a/16671476/1577396). — Mr_Green, Mar 12 '14 at 09:26

score 3 · Accepted Answer · answered Mar 12 '14 at 09:24

3

Just check this JsFiddle code. If thats what is your requirement, then add the below code

::-webkit-scrollbar {
    width: 0px;
}

answered Mar 12 '14 at 09:24

mulla.azzi

but there are no arrows. although this is a good one. – Jai Mar 12 '14 at 09:26
try this fiddle http://jsfiddle.net/2aHeE/537/ – mulla.azzi Mar 12 '14 at 09:34
@mulla.azzi can you do the same horizontally with the help of arrows(keyboard). when we add scroll bar we can scroll horizontally with the help of left and right arrow keys on keyboard. so, now i want that functionality but that scrollbar should not be visible. – user3409832 Mar 12 '14 at 10:17
checkout this fiddle http://jsfiddle.net/2aHeE/538/ – mulla.azzi Mar 12 '14 at 10:26

score 0 · Answer 2 · answered Mar 12 '14 at 09:29

0

This is just the very basic version of it, but it should get you going:

$('.up').on('click', function(e) {
    e.preventDefault();
    p.css({
        marginTop: "-=20"  
    })
});

answered Mar 12 '14 at 09:29

Jonas Grumann

@mulla.azzi ya thats what I want but its working only vertically, I want horizontally with left and right arrows. Thanks in advance. – user3409832 Mar 12 '14 at 10:11
Just look at the code, it says marginTop, change it with marginLeft and you're fine. – Jonas Grumann Mar 12 '14 at 10:17

2 Answers2