滚动条控制水印效果-优快云博客

可以通过给body添加onscroll属性或者把事件处理函数分配给window.onscroll属性。
下面是一个始终在页面的顶部显示的水印。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>

<BODY>
<SCRIPT LANGUAGE="JavaScript">
<!--
window.onscroll =function(){
  var oWatermark = document.getElementById("divWatermark");
  oWatermark.style.top = document.body.scrollTop;
}
//-->
</SCRIPT>
<div id ="divWatermark" style = "position:absolute; top :0px;right:0px; color:#cccccc; width:150px;height:30px; backgrond-colot:naty">Watermark</div>
<p>212121</p>
<p>212121</p>
<p>212121</p>
<p>212121</p>
<p>212121</p>
<p>212121</p>
<p>212121</p>
<p>212121</p>
<p>212121</p>
<p>212121</p>
<p>212121</p>
<p>212121</p>
<p>212121</p>
<p>212121</p>
<p>212121</p>
<p>212121</p>
<p>212121</p>
<p>212121</p>
<p>212121</p>
<p>212121</p>
<p>212121</p>
<p>212121</p>
<p>212121</p>
<p>212121</p>
<p>212121</p>
<p>212121</p>
<p>212121</p>
<p>212121</p>
<p>212121</p>
<p>212121</p>
</BODY>
</HTML>

scroll事件