I have created an extension to make a specific web site easier to use. So I do not have access to the source code. I only want to modify the CSS; I am not asking how to hack the web site. This is not worth a lot of effort so there is no need to spend much time on this.
The web site apparently uses Vuebar; a fiddle showing sample use of that is at Vue 2.0 Hello World - JSFiddle. Note that in that sample, there is a scroll bar (something like a scroll bar) at the right of the sample. Note that we can scroll using the mouse wheel and we can scroll by dragging the scroll bar but we cannot (I cannot) scroll by clicking in the scroll bar, like we can in normal scroll bars.
Is there an easy modification of the CSS to allow scrolling by clicking with the mouse like for normal scroll bars? If it is not easy then I won’t bother pursuing this. If I had developed the web site then I would not use a custom scroll bar like that. I could write a lot of code to replace the custom scroll bar with a regular scroll bar but this is not worth it.
Thank you and unfortunately that does not seem to work. The scroll bar acts the same.
Since it is code made available to the public it is likely there is no easy solution. I could try asking the developer but I assume they would have enhanced their code if there is an easy solution. If you have any other suggestions then it is easy enough for me to try it.
Can you add the code I gave you to your fiddle so I can see what’s happening?
Or do you have a live version to look at now ?
Edit:
Actually I think I may have misunderstood what you wanted on re-reading the post
I was thinking you wanted to click in the box and then scroll with the mouse which is not possible without my code. However I now think you wanted to click on the top or bottom of the scroll bar itself in order to scroll and if so then that would probably require scripting by the author.
Yes I have the extension that I can simply add CSS to and then reload the extension.
I apologize for not being clear. I said like for normal scroll bars and that is meant to say (I think) that I want to be able to click on the top or bottom of the scroll bar.
PaulOB is right, there doesn’t seem to be an easy way to change the existing Vuebar behaviour, but it’s not too complicated to override Vuebar and display a regular scrollbar again.
The following CSS should work:
.vb-visible {
overflow: auto auto !important;
padding: 20px;
}
.vb-content {
overflow: initial !important;
}
.vb-dragger {
display: none;
}
