Skip to content

Instantly share code, notes, and snippets.

@mponizil
Last active January 3, 2016 15:29
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save mponizil/8483445 to your computer and use it in GitHub Desktop.
Save mponizil/8483445 to your computer and use it in GitHub Desktop.
webkit translate3d scrolling bug
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
@-webkit-keyframes spin{
from{
-webkit-transform:rotate(0deg);
}
to{
-webkit-transform:rotate(360deg);
}
}
</style>
</head>
<body style="height:2000px">
<a style="-webkit-animation: spin 750ms infinite linear; display: block;"></a>
<div style="position:absolute;z-index:10;">
<div style="position:fixed;">
<div style="width:200px;height:200px;background-color:gray;overflow-y:auto;">
<p style="position:relative">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla rutrum, dolor non volutpat ullamcorper, diam felis vulputate sapien, ut euismod justo lectus vitae sem. Curabitur placerat adipiscing mi, ac tempus elit mollis sit amet. Vivamus vestibulum aliquam tellus, in fermentum arcu faucibus vel. Proin at vulputate elit. Nullam eget augue mauris. Mauris sollicitudin placerat quam, et accumsan lacus porta vitae. Vivamus tempor erat ac laoreet tempus. Integer eu neque nunc.</p>
<p style="position:relative">Aliquam venenatis tincidunt blandit. Quisque tristique eros mi, vel accumsan arcu rhoncus at. Donec suscipit lacus ut feugiat luctus. Donec rutrum dui rhoncus augue sollicitudin, vitae euismod justo congue. Aenean laoreet, ligula quis rutrum malesuada, arcu sapien dignissim mauris, ac luctus felis risus nec diam. Nullam imperdiet metus at ipsum semper, non mollis ligula tempus. Quisque adipiscing felis leo, porta ornare est vestibulum nec. Cras auctor dui a urna volutpat tristique. Aliquam erat volutpat.</p>
</div>
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment