<style type="text/css">
.elementFixed{
position: fixed;
top:0;
}
</style>
<body>
<input type="hidden" id="scroll_return" value = "">
</body>
< Script type = "text / JavaScript" >
/ * *
* a fixing element, when an element is scrolled to the top of the browser, fixed fixing
* firstDiv: a first element
* secondDiv: second element
* firstDiv + secondDiv: because fixed will flow out of the document, firstDiv secondDiv width in order to avoid deformation
* /
function fixedDiv (firstDiv, secondDiv) {
// distance from the top of the browser targeting elements
var fixedH = $ ( " #firstId " ) .offset () .top;
// add window scroll bar event
$ (window) .scroll ( function () {
// scrollbar sliding distance
var the scrollH = $ ( the this) .scrollTop ();
// scrollbar sliding distance greater than the distance from the top of the browser targeting elements, is fixed, whereas no fixed
IF (the scrollH > fixedH) {
// Returns whether
var scroll_return = document.getElementById ( " scroll_return " ) .Value;
// there the return value
IF ( " scroll_return " == scroll_return) {
return to true ;
}
// the console.log (" fixed scrolling distance: "the scrollH +);
$ ( " #tableTbodyId " ). HTML (firstDiv + secondDiv);
$ ( " #TableTheadId " ) .addClass ( "elementFixed " );
// assignment returns, do not continue to add the next
document.getElementById ( " scroll_return " ) .Value = " scroll_return " ;
} the else {
// the console.log ( " is not fixed, rolling distance: "+ scroH);
$ ( " #tableTbodyId " ) .html (secondDiv);
$ ( " #tableTheadId " ) .removeClass ( " elementFixed " );
//Empty rolling assignment
document.getElementById ( " scroll_return " ) .Value = "" ;
}
})
}
// Clear scroll events
$ (window) .unbind ( ' Scroll ' );
</ Script >