How To Remove Awesomium.net Scroll Bars? & Auto Scroll? - javascript

I want to remove scroll bars from Awesomium.net web control.
In visual studio defualt web browser you can easily remove scroll bars like this.
Public Sub loadVideo(pLink As String)
WebBrowser1.ScrollBarsEnabled = False
End Sub
but i dont know how to do this on Awesomium.net web control.
If there isn't a way to do this on Awesomium.net web control, is there javascript or CSS code i can put to my webpage to achieve those two things?
Thanks.

I haven't used Awesomium, but it's probably best to remove the scrollbars in CSS. Even if the whole outer web control/page has no scrollbars, the page can have an element in it that takes up all or almost all of the view area and does have scrollbars.
It depends if you want to just hide the graphical scrollbar or disable scrolling. The usual way to stop an element scrolling is to use the CSS overflow property, like so:
/* Disable scrolling on body */
body {
overflow:hidden;
}
/* Optionally, disable scrolling on everything (not recommended because it's too strong) */
* {
overflow:hidden;
}
There's more information searching "css remove scrollbars" or in this previous answer.

A quick google search for "Remove Awesomium.net Scroll Bars" yeiled the following result:
How To Hide Scroll Bars In A WPF Webcontrol
Another few searches, and I found a solution for your second problem:
How To Inject Javascript On Document Ready Of Any Page
Scroll automatically to the bottom of the page

Related

Show scrollbars on iOS when scrolling via Javascript

I would like the vertical scrollbar to be displayed when I call element.scrollTop = <somePosition>;
Here is an example of what I'm trying to achieve: https://plnkr.co/edit/0ls05cCa3XrvrWPO?open=lib%2Fscript.js&preview
If that example is loaded on iOS, when the left box is scrolled, the right box should sync with it. That works just fine, but I need a way for the scrollbar to also show up.
I think your issue is that division being scrolled via Javascript is not recognized as active, to keep scrollbar visible.
I would suggest to try any custom Scrollbar library, they manage scrollbars with divisions rather than browser's.
Many such would allow you to configure scrollbar to be shown and hidden using Javascript.
It would add additional work for you, but it can be a solution to go with.
Here are few you can try with: https://www.jqueryscript.net/blog/Best-Custom-Scroll-Bar-jQuery-Plugins.html
You could dynamically add a css class to the container when performing scrollTop().
Try a class that implements overflow-y: scroll when applied. That should yield the desired effect.

Adding a functional Scrollbar to a ListView for users who don't like touch scrolling

I have a requirement to add a scroll bar that is always visible and which can be directly used by mouse or touch to scroll the contents of a large ListView.
The normal way of scrolling on mobile devices is by swiping up or down. During the scroll process there will be a small scrollbar visible but that scrollbar disappears and even while visible it can't be used to do any actual scrolling.
After much searching I could not find what I needed.
So my question is: Is there a way to make the scrollbar in the ListView fully usable or should I disable it and create a separate scrollbar which I will need to keep in sync. If so how?
For a functional example of something I would be working with see: https://fiddle.sencha.com/#fiddle/124j

How to avoid any offset from a scrollbar in dynamic pages in HTML/CSS

I'm making a dynamic page, in HTML/CSS using Javascript and jQuery. The height of this page can change, and a scrollbar can appear or disappear. Also, I want the content to be centered. To achieve that, I use margin: 0 auto;. But when the scrollbar shows itself (or hides itself), the page moves a little on the side.
How can I prevent it from moving left and right ?
EDIT
Here's a jsfiddle to see what the problem is (sorry, the content is in French):
http://jsfiddle.net/r4jspomr/
You can click on the titles to extend/retract the content under it
it is default Behavior of browsers, you can disable scrollbar using the following code and then use a beautiful custom-scrollbar like this
$("body").css("overflow", "hidden");

jquery.fullPage.js how to enable scroll within a div without affecting the sections scroll

Right, this is not easy to explain... I'm using jquery.fullPage.js for a website. I have a few collapsable panel hosting a big amount of copy which requires scroll. My problem begins when I enable the scroll on this panel because it sends me to the next section. Is there any way for me to scroll within this panel without affecting the full page scroll?
Thanks guys
Yeah, fullpage.js plugin offers an option called normalScrollElements . As detailed in the documentation:
If you want to avoid the auto scroll when scrolling over some elements, this is the option you need to use. (useful for maps, scrolling divs etc.) It requires a string with the jQuery selectors for those elements. (For example: normalScrollElements: '#element1, .element2')
If you need more control you can always use the fullpage.js method setAllowScrolling to allow the autoScrolling or disable it. This way you can disable it when opening a popup, for example, and enable it again once you close it.

How do you create a html scrollable area, that just uses the main browser scrollbar

I was looking at an issue in JIRA (e.g. here, an issue in JIRA 4) and I noticed JIRA 4 has some interesting scrolling behaviour, where when scrolling down with the main browser scrollbar,the jira header scrolls up out of way, then the issue title stays fixed at top, then the rest of the issue continues to scroll. So the issue title is always visible.
There isn't an extra vertical scrollbar. Its all scrolled via the main browser scrollbar. So its either css or javascript magic! Any idea how they do that?
Cheers,
Phil.
It changes dynamically the div #stalker which has position:absolute;top:76px;. When the user scroll, change the position to position:fixed;top:0 and keep it in a fixed place, giving you the ability to scroll the rest content.
Edit
I created an example of this behavoir, because I was curious and here the demo if you want to check it http://jsbin.com/igiji5/3
Atlassian published the source of the Javascript at http://docs.atlassian.com/aui/3.0/jquery.stalker.js.html
That is created using JavaScript.
I can see by using FireBug to inspect the div#stalker that it changes class and style attributes when you are scrolling.

Categories

Resources