漂浮窗口的实现

最新推荐文章于 2024-03-31 13:19:54 发布

kandy_java

最新推荐文章于 2024-03-31 13:19:54 发布

阅读量849

点赞数

分类专栏： js

本文链接：https://blog.csdn.net/u010866487/article/details/17401653

版权

js 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">  
<HTML>  
<HEAD>  
<TITLE> New Document </TITLE>   
</HEAD>  
  
<BODY>  
<div id="img" style="position:absolute; left:35px; top:556px; width:120;height:172;background-color: #EBEBEB;">  
  
<table background="01.gif" width=100 height=100>  
 <tr> <td align="center" valign="bottom"> <a href="#">上海师范大学  </a></td> </tr>  
<tr><td align="center" valign="top"> 欢迎您!  </td>  </tr>  
</table>  
</div>

<SCRIPT LANGUAGE="JavaScript">   
var xPos = 20;   
var yPos = document.body.clientHeight;   
var step = 1;   
var delay = 30;  
var height = 0;    
var Hoffset = 0;   
var Woffset = 0;   
var yon = 0;    
var xon = 0;   
var pause = true;   
var interval;  
img.style.top = yPos; 
start();   
function start() 
{    
  img.visibility = "visible";  
  interval = setInterval('changePos()', delay);   
} 
function changePos() 
{  
    width = document.body.clientWidth; //网页可见区域宽   
	height = document.body.clientHeight;//网页可见区域高    
	Hoffset = img.offsetHeight;    
	Woffset = img.offsetWidth;   
	img.style.left = xPos + document.body.scrollLeft; //网页被卷去的高   
	img.style.top = yPos + document.body.scrollTop;//网页被卷去的左    

	if (yon) 
	{    
	   yPos = yPos + step;    
	}    
	else 
	{    
	  yPos = yPos - step;    
	}  	  
	if (yPos < 0) //y轴方向的距离为负值,改变yon、yPos使其向下移动
	{    
	 yon = 1;  
	 yPos = 0;  		  
	}    
	if (yPos >= (height - Hoffset))//y轴方向的距离超出来了可移动的距离
	{  
		yon = 0;  	  
		yPos = (height - Hoffset);   
	}    
	if (xon) //x轴正方向移动
	{    
	  xPos = xPos + step;  	  
	}    
	else 
	{    
	  xPos = xPos - step;  	  
	}    
	if (xPos < 0)  //x轴方向的距离为负值,改变xon、xPos使其向右移动
	{    
	  xon = 1;   
	  xPos = 0;    
	}  	  
	if (xPos >= (width - Woffset)) //x轴方向的距离超出来了可移动的距离
	{    
		xon = 0;  	  
		xPos = (width - Woffset);    
	}  		  
}  
</script>