I have an element which sits in the upper left hand corner. It is part of a print manager and has some UI on it. Here is the code I am using to ensure that it sits in the same place on scroll.
var printManagerElement = document.getElementById("printManager");
var windowReference = $(window);
window.onscroll = function () {
printManagerElement.style.top = windowReference.scrollTop() + "px";
};
When the scrolling is slow, there is no tearing. But if I scroll my mousewheel as fast as possible once, or grab the scroll bar and quickly move it, then I notice a split second of tearing.
Is the tearing preventable? Is there a way I can speed this code up? Or an alternative to this method?
edit
The div's style looks like this
padding:2px;
margin:2px;
border: 1px solid blue;
background-color:white;
position:absolute;
top:0px;
left:0px;
z-index:10;