这里有新鲜出炉的 Javascript 教程,程序狗速度看过来!
Javascript 是一种由 Netscape 的 LiveScript 发展而来的原型化继承的基于对象的动态类型的区分大小写的客户端脚本语言,主要目的是为了解决服务器端语言,比如 Perl,遗留的速度问题,为客户提供更流畅的浏览效果。
这篇文章主要介绍了基于 JS 实现二维码图片固定在右下角某处并跟随滚动条滚动, 代码简单易懂非常不错,具有参考借鉴价值,需要的朋友可以参考下
1、准备一张二维码图片,大小、图片自己定义我这里用的宽度和高度都是 253,名称 weixin.jpg
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
- <title>
- 二维码图片固定在右下角某处并跟随滚动条滚动
- </title>
- </head>
- <body>
- <div style="width:1000px; height:1000px;">
- 二维码图片固定在右下角某处并跟随滚动条滚动
- </div>
- <script language="javascript">
- function wx_scroll() {
- var topH = -80;
- var leftW = 10;
- var sHeight, sWidth, cHeight;
- //alert(document.documentElement.clientWidth);
- (document.body.scrollLeft == 0) ? sWidth = document.documentElement.scrollLeft + document.documentElement.clientWidth - 260 : sWidth = document.body.scrollLeft + document.documentElement.clientWidth - 260; (document.body.scrollTop == 0) ? sHeight = document.documentElement.scrollTop + document.documentElement.clientHeight - 260 : sHeight = document.body.scrollTop + document.documentElement.clientHeight - 260;
- document.getElementById("bar_float").style.left = eval(sWidth + leftW) + "px";
- document.getElementById("bar_float").style.top = eval(sHeight + topH) + "px";
- }
- setInterval("wx_scroll()", 100);
- </script>
- <div id="bar_float" style="position: absolute; display:block; z-index: 10000; left: 1216px; top: -80px;">
- <div id="stayTopleft">
- <table cellspacing="0" cellpadding="0" border="0">
- <tbody>
- <tr>
- <td colspan="2" valign="top">
- <img src="weixin.jpg" width="253" height="253" border="0">
- </td>
- </tr>
- <tr>
- </table>
- </div>
- </div>
- </body>
- </html>
来源: http://www.phperz.com/article/17/0601/327920.html