I face the following issue when using the latest Vaadin version.
I have a grid w/ some columns. I resize the browser window in a way to make the horizontal scroll bar appear.
After that i move the scrollbar to the rightmost position.
After that i maximize browser window and then minimize it back.
And after that step the horizontal scroll bar disappears.
is it a bug in vaadin or anything else?
Thank you.
Related
I have a modal that has a horizontal scrollbar when the modal is resized on small screens. When that horizontal scrollbar appears, the vertical scrollbar disappears because it is stuck to the right. I would like the vertical scrollbar to stay at the right side of the modal while I scroll horizontally to the right. A picture of this behavior is show below. I want the vertical scrollbar stuck on the right while I horizontally scroll to the right rather than only being present when I finish horizontally scrolling to the right.
Is there a way to accomplish this? I believe another issue is that on Windows devices the scrollbar takes up space unlike in Mac devices.
You can customize the scrollbar a bit (see https://www.w3schools.com/howto/howto_css_custom_scrollbar.asp), however, I don't know if you can change the position.
I did find a javascript scrollbar-plugin, which I haven't tried, but maybe it is worth a try? You can find it at https://grsmto.github.io/simplebar/.
As i'm using gridstack.js http://gridstackjs.com/ . As i'm facing a problem when resizing the widget at the bottom of the screen. That is scroll is not moving and resize has been blocked.
Can any one suggest me any workaround method to resize the widget.
If you looking on the docs (https://github.com/gridstack/gridstack.js/blob/develop/doc/README.md#options) you'll find the draggable option, if you alter the "scroll:false" to "scroll:true" that should allow for dragging to automatically scroll when you drag the widget off the page.
I'm using the pageslide.js to create responsive menu. it works fine when I manually shrink down the screen size. However, once I turn on the side panel and didn't close it. it would stay there when I drag the screen to wider size and the top menu showed. Unless I refreshed the page, the panel won't disappear.Any one knows how to fix the issue?
I have a position:fixed sidebar on my site on the left with other content to the right. On a desktop browser, when you zoom in, all page content scales appropriately as you would expect. But if you pinch to zoom in on iOS, the content on the right slides underneath the fixed sidebar. The sidebar zooms in size but is always fixed to the edge of the screen. Now I noticed with Safari on Mac when you pinch to zoom in, that's not the case - it appears to revert to static positioning because the sidebar may not be fully visible - it doesn't get fixed to the screen. That's the desired behavior I want on iOS. Is there some way I can do that, besides trying to detect scale changes and manually changing the style to absolute/fixed? Thanks!
I need what this...
$('#gatewayDimmer').width($('html').width());
$('#gatewayDimmer').height($('html').height());
$('#gatewayDimmer').css('display','block');
...is controlling to occupy the full screen/scrollable window. In FireFox, it does except for maybe...11px thats initially under the vertical scrollbar(when you use the horizontal scrollbar and scroll right, you can see the area under the vertical scrollbar was never occupied). In IE(7 at least), it occupies everything in the initial window, even the area underneath the vertical & horizontal scrollbars, but after scrolling down past the area the horizontal scrollbar would've covered, it doesn't occupy anything(it stops). I need every inch, pixel, etc. covered, from head to toe. To lock it, if you will. Is there something I can add, change here? Thanks in advance
The following seems to have worked:
$('#gatewayDimmer').css({display:'block', position:'fixed'});