Overflow issue in google chrome - google-chrome

See this page in Chrome: http://jsbin.com/onariz/
Now it looks normal:
Ok. Now if you have a scroll wheel on your mouse this is where you are going to want to use it.
Click with the scroll wheel in the scrollable area of the page and drag your mouse to the corner.
Now -- what the heck? Why does the page do this:
Why would it do that?
How can I prevent that, or is this just a Google Chrome glitch? (I am using Chrome version 14.0.835)

The issue has been fixed in newer version of Chrome: http://code.google.com/p/chromium/issues/detail?id=89366

Related

scrollbar disappeared when i add mouse to mac at first time

Scrollbar disappeared when I add mouse to mac at first time.
please look at this links.
demo link
When I add mouse to my mac, scroll bar disappeared and a white color box coming right top corner. I do not know why. firefox working fine. chrome safari, and opera i.e had this issue. After refresh the page i could see scrollbar. Help me if you know/face this issue before.
screenshots here... who does not able to understand my issue.
screen shot one after i insert mouse to mac machine scroll disappeared and getting square box right top corner:
after I refresh the page i get see scrollbar.
You can change the setting in the preferences. By default, the scroll bar is hidden with mac products.
Odds are if a user is using a Mac, they're already aware of this and it's considered a feature to them.
But, if you really need it, try using the webkit css pseudo selector ::-webkit-scrollbar
This will only work in Safari and Chrome.

Chrome/Webkit UI repaint issue when showing a modal window (ngDialog)

I'm working on a hybrid app using Cordova, Bootstrap and Angular JS (1.3.x) and testing it in a Chrome desktop browser and on a Android device (lollipop, 5.0.2).
In a particular view, I open a modal window using ngDialog. The content in this dialog can exceed the height of a typical smartphone size, so vertical scrolling is required. And here comes the problem:
Most of the elements that should be displayed at the bottom of the dialog (out of initial sight) do not appear or don't getting rendered. When I blindly tap on the area where the disappeared interactive elements should be, they will get painted. When I then scroll up again, elements at the top disappear.
This behavior didn't exist on Android 4.4.
Now I'm able to reproduce this error on my Windows Chrome Browser (v43).
These are the steps:
Run this Plunkr http://embed.plnkr.co/VGYUe2i9vwsQZ21vc3LB/preview
Test with a recent Chrome Version
Make sure, this plunker is shown in embedded view (important)
Open Chrome developer tools
Click "Toggle device mode" (smartphone icon) (important)
Limit the vertical resolution to about 600px in height Click "open dialog" and scroll down to the bottom
Can you read "Hello, do you see me?" ?
If not, press on one of the panels on top or below the textbox, this
will cause a repaint and you can see the text.
This is how it looks:
Not OK -> No text in marked red boxes:
OK -> After clicks on it or browser tab switch
I found this article on postman blog, but the "fixer" does not seem to work in my case.
http://blog.getpostman.com/2015/01/23/ui-repaint-issue-on-chrome/
Can someone point me to the right direction?
I followed the instructions in the linked blogpost and those seem to work for me. Specifically, adding
-webkit-transform: translate3d(0,0,0);
to my CSS for ngDialog-content which has overflow-y: scroll.
Now the div scrolls on load for me.
The other good news is that at least my issue seems to be gone in Chrome Canary, so it may be worth seeing if the issue still exists for you there.

Page header problems in Google Chrome when scrolling

I found a problem in Google Chrome on Ubuntu: When I scroll the page with the mouse roller, the page header doesn't look good when I scroll to the top of the page (sometimes the problem is fixed after a few seconds, sometimes not). It happens only in some websites. Is it a known bug of Google Chrome? I'm using Google Chrome Version 33.0.1750.117.

Disable lagging scrollbar in Chrome Developer Tools sources window

After a recent update to Google Chrome (currently I'm at 30.0.1599.101), the Sources window of the Developer Tools now has the scrollbar lag as I drag it down. The effect is kind of like Facebook's 'infinite scroll', in that if I drag the scrollbar to the bottom, it doesn't actually scroll to the very end of the source. Instead goes only part of the way, and the scrollbar position then pops back up toward the middle. In order to get to the end or even middle of a longer document, I have to drag the scrollbar down multiple times. The only workaround I see is to hit Ctrl-End (Windows) and then scroll back upwards, which seems like unnecessary extra keystrokes.
This lag effect is appropriate for applications like Facebook, but it's very irritating here. Is there any way to disable this effect?
This is an issue https://code.google.com/p/chromium/issues/detail?id=269941 that is fixed in M31. You could wait for it to reach stable or try using dev/beta/canary channel as a workaround for now.

Thickbox 3.1 IE8 scrolling problem

Having a slight problem with
http://jquery.com/demo/thickbox/
In IE8, the overlay window doesn't scroll when you scroll down in the browser. So if you click something at the bottom of the browser window, the overlay window pops up but at the top of the screen so you have to scroll back up. This only happens in IE8, all other browsers the overlay window follows. Help? Thanks
I had the same problem, but only when using <frames> or <iframes>. Being unable to correct the problem, along with a few other bugs, I decided switch to using Shadowbox http://www.shadowbox-js.com/. I found it to be ALOT more flexible. Just a suggestion. But as for the IE8 problem you reported, I never encountered the issue in a parent window, just when using frames.