Menu
I have an issues with Webkit browsers. The issue happens when I focus my cursor to the <input> element and start to move mouse without releasing the button.
Here is a screencast - http://screencast.com/t/P1BnT7ZAdc
Here is a html/css demo - http://napokrovke.mysundays.net/webkit_bug.html
How can I prevent this behavior?
540
To hide the horizontal scrollbar and prevent horizontal scrolling, use overflow-x: hidden: HTML.
CSS solution To stop the scroll at the end of an element, set on the element's CSS: overscroll-behavior: contain; This way, if the user reaches the end of the scroll of an element, it will stop there and not “scroll-chain” to the body or parent element.
To do this (in Chrome, Firefox, and Edge), we can add the CSS property overscroll-behavior: contain to the overflow: auto element. This will prevent the "scroll chaining" behavior, which will, in turn, keep the mouse-wheel active within the target element.
This is not a bug, its because you've set the wrapper to 300px, and applied the overflow property of hidden to it, which allows you to scroll around if the content within is greater than the 300px you defined, Im in firefox on OSX and I can also scroll around in it.
the only way this can be forced is maybe to apply this to the text field html markup
onmousedown="event.preventDefault ? event.preventDefault() : event.returnValue = false; this.focus()"
this should disable the user from dragging around when selected inside the box, but then it also disables you clicking inside the box, so using focus you have to focus this box manually. but if thats what you really want?
97
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
