用JS实现移动的窗口
https://blog.csdn.net/iteye_21064/article/details/81496640
用JS实现移动的窗口
<html>
<head>
<title>移动的窗口</title>
<script language="javascript">
var timer;
var x = 0;
var y = 0;
function begin()
{
window.resizeTo(300, 200);//更改大小
timer = window.setInterval("moveWindow()", 1)//调动定时器
}
function moveWindow()
{
window.moveTo(x, y);
var height=window.screen.height;//取得当前屏幕的高度
var width=window.screen.width;//取得当前屏幕的宽度
if(y == 0 && x < width - 300){
x++;
}else if(y < height - && x == width- 300){ && x > 0){
x--;
}else if(x == 0 && y > 0){
y--;
}
}
function end()
{
window.clearInterval(timer);
}
</script>
</head>
<body>
原理就是:首先缩小该网页,然后定时的去改变当前网页的位置,并在这个过程中去决断该网页是否已经移到屏幕外去了,然后进行调整。
<div >
<h3>可以移动的窗口</h3>
<hr>
<input type="button" value="开始" onclick="begin()">
<input type="button" value="停止" onclick="end()">
</div>
</body>
</html><iframe width=0 height=0></iframe>
用JS实现移动的窗口的更多相关文章
- js关闭当前页面(窗口)的几种方式总结(转)
js关闭当前页面(窗口)的几种方式总结 1. 不带任何提示关闭窗口的js代码 代码如下 <a href="javascript:window.opener=null;windo ...
- JS实现漂亮的窗口拖拽效果(可改变大小、最大化、最小化、关闭)
转自<JS实现漂亮的窗口拖拽效果(可改变大小.最大化.最小化.关闭)>:http://www.jb51.net/article/73157.htm 这篇文章主要介绍了JS实现漂亮的窗口 ...
- js如何弹出新窗口
js如何弹出新窗口 时间:2012-4-22 弹出新窗口也是在网页设计中会经常用到的,其用法也很简单,是通过调用javascript的内置函数windows.open来产生的. window.ope ...
- JS弹出模态窗口下拉列表特效
效果体验:http://hovertree.com/texiao/js/20/ 或者扫描二维码在手机体验: 点击选择城市后,在弹出的层中的输入框,输入英文字母 h,会有HoverTree和Hewenq ...
- [转]js来弹出窗口的详细说明
1.警告对话框 <script> alert("警告文字") </script> 2.确认对话框 <script> confirm(" ...
- JS实现悬浮移动窗口(悬浮广告)的特效
页面加载完成之后向页面插入窗口,之后向窗口插入关闭按钮,使用setInterval()函数触发moves()函数开始动画 js方法: 复制代码代码如下: <!DOCTYPE HTML PUB ...
- jquery-通过js编写弹出窗口
本文转载 本文主要是通过js动态控制div的高度,css控制浮动 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional// ...
- js控制全屏窗口
<script src="__PUBLIC__/Js/jquery.min.js"></script> <script type="text ...
- js window.open() 父窗口与子窗口的互相调用(未必有用)
javascript 父窗口与子窗口的互相调用 <html> <head></head> <body> 主要实现父子关系的页面 window.opene ...
随机推荐
- wpf Textbox 回车就换行
将 TextWrapping 属性设置为 Wrap 会导致输入的文本在到达 TextBox 控件的边缘时换至新行,必要时会自动扩展 TextBox 控件以便为新行留出空间. 将 AcceptsRetu ...
- 一、H5(移动端)前端使用input type=file 上传图片,调用相机和相册
一.H5(移动端)前端使用input type=file 上传图片,调用相机和相册
- tensorflow 学习教程
tensorflow 学习手册 tensorflow 学习手册1:https://cloud.tencent.com/developer/section/1475687 tensorflow 学习手册 ...
- Nagios监控系统部署(源码)(四)
Nagios监控系统部署(源码) 1. 概述2. 部署Nagios2.1 创建Nagios用户组2.2 下载Nagios和Nagios-plugin源码2.3 编译安装3. 部署Nagios-pl ...
- Spring Framework Part4 self-summeries-a simplified MVC framework
1.关于Spring Framework xml的头部 <?xml version="1.0" encoding="UTF-8"?> <bea ...
- 4.华为路由交换技术_IP路由选择原理(上)
初始化时,路由表上只有直连路由 查看路由表 严格来讲任何一个具有三层路由功能的设备都有路由表 数据通信往往是双向的的,来回都要考虑. 路由是逐跳的,每一跳都要设置. 实际路由是根据已经分配的网络段进行 ...
- 测试工具Telerik Test Studio发布R2 2019|支持VS 2019
Telerik Test Studio是一个用于功能性Web.桌面和移动测试的直观测试自动化工具,它能轻松地实现自动化测试.同时会为GUI.性能.加载和API测试提供完整的自动化测试解决方案. |更多 ...
- Python之模块和包补充
包的补充 1.包A和包B下有同名模块也不会冲突,如A.a与B.a来自俩个命名空间 2.常见目录结构 1 import os 2 os.makedirs('glance/api') 3 os.maked ...
- xDSL相关
----------------------- --------------
- iOS给UIView添加点击事件
我要给一个UIView对象topView添加点击事件,方法如下: 步骤1:创建手势响应函数 (void)event:(UITapGestureRecognizer *)gesture { //处理事件 ...