| <style> |
| html { |
| overflow: auto; |
| } |
| body { |
| position: absolute; |
| top: 20px; |
| left: 20px; |
| bottom: 20px; |
| right: 20px; |
| padding: 30px; |
| overflow-y: scroll; |
| overflow-x: scroll; |
| } |
| ::-webkit-scrollbar { |
| width: 12px; |
| height: 12px; |
| } |
| ::-webkit-scrollbar-track { |
| -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); |
| -webkit-border-radius: 10px; |
| border-radius: 10px; |
| } |
| ::-webkit-scrollbar-thumb { |
| -webkit-border-radius: 10px; |
| border-radius: 10px; |
| background: rgba(255,0,0,0.8); |
| -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); |
| } |
| ::-webkit-scrollbar-thumb:window-inactive { |
| background: rgba(255,0,0,0.4); |
| } |
| ::-webkit-scrollbar:window-inactive { |
| width: 100px; |
| height: 100px; |
| } |
| div { |
| width: 300px; |
| height: 300px; |
| border: thin solid black; |
| overflow: scroll; |
| } |
| </style> |
| <body> |
| <div> |
| <p style="height:350px"> |
| Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. |
| Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero |
| sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. |
| Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, |
| commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, |
| eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar |
| facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, |
| eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan |
| porttitor, facilisis luctus, metus.Pellentesque habitant morbi tristique senectus et netus |
| et malesuada fames ac turpis egestas.Vestibulum tortor quam, feugiat vitae, ultricies eget, |
| tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi |
| vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. |
| Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, |
| elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. |
| Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus |
| faucibus, tortor neque egestas augue,eu vulputate magna eros eu erat. Aliquam erat volutpat. |
| Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus. |
| </p> |
| </div> |
| Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. |
| Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero |
| sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. |
| Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, |
| commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, |
| eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar |
| facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, |
| eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan |
| porttitor, facilisis luctus, metus.Pellentesque habitant morbi tristique senectus et netus |
| et malesuada fames ac turpis egestas.Vestibulum tortor quam, feugiat vitae, ultricies eget, |
| tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi |
| vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. |
| Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, |
| elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. |
| Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus |
| faucibus, tortor neque egestas augue,eu vulputate magna eros eu erat. Aliquam erat volutpat. |
| Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus. |
| Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. |
| Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero |
| sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. |
| Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, |
| commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, |
| eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar |
| facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, |
| eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan |
| porttitor, facilisis luctus, metus.Pellentesque habitant morbi tristique senectus et netus |
| et malesuada fames ac turpis egestas.Vestibulum tortor quam, feugiat vitae, ultricies eget, |
| tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi |
| vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. |
| Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, |
| elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. |
| Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus |
| faucibus, tortor neque egestas augue,eu vulputate magna eros eu erat. Aliquam erat volutpat. |
| Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus. |
| Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. |
| Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero |
| sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. |
| Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, |
| commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, |
| eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar |
| facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, |
| eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan |
| porttitor, facilisis luctus, metus.Pellentesque habitant morbi tristique senectus et netus |
| et malesuada fames ac turpis egestas.Vestibulum tortor quam, feugiat vitae, ultricies eget, |
| tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi |
| vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. |
| Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, |
| elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. |
| Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus |
| faucibus, tortor neque egestas augue,eu vulputate magna eros eu erat. Aliquam erat volutpat. |
| Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus. |
| </body> |
| <script> |
| window.onload = function() { |
| // setWindowIsKey shall set the focus of the window. |
| if (window.testRunner) |
| window.testRunner.setWindowIsKey(false); |
| } |
| </script> |
