使用JS怎样做窗口滚动的效果？
发布时间：2022-02-25 13:35:33 所属栏目：语言 来源：互联网
导读：这篇文章主要给大家分享使用JS做窗口滚动效果的内容，小编觉得挺有意思的，因此分享给大家做个参考，实现效果和代码如下，感兴趣的朋友可以参考，希望大家阅读完这篇文章能有所收获，下面我们一起来学习一下吧。 一.实现的效果图 二.涉及到的知识点 window.o
|
这篇文章主要给大家分享使用JS做窗口滚动效果的内容，小编觉得挺有意思的，因此分享给大家做个参考，实现效果和代码如下，感兴趣的朋友可以参考，希望大家阅读完这篇文章能有所收获，下面我们一起来学习一下吧。 一.实现的效果图 二.涉及到的知识点 window.open();方法用于打开一个新的浏览器窗口或查找一个已命名的窗口。 moveTo():方法可把窗口的左上角移动到一个指定的坐标。 window.screen.height:屏幕像素的高度 window.screen.width：屏幕像素的宽度 window.screenLeft;左边距离屏幕的距离 window.screenTop;上面距离屏幕的距离 setTimeout：方法用于在指定的毫秒数后调用函数或计算表达式，setTimeout(function, milliseconds）。 三.代码实现 <!DOCTYPE html> <html lang="utf-8"> <head> <meta charset="UTF-8"> <title>滚动窗口</title> <script> var w ;//页面的宽度 var h;//页面的高度 var x;//距离屏幕水平位置 var y;//距离屏幕垂直的位置 var v = 5;//每次水平移动的位置 var s = 8;//每次垂直移动的位置 function windowOpen(){ mywindow =window.open('','','width=200px,height=100px'); mywindow.document.write("这个是打开的窗口"); w =window.screen.width; h=window.screen.height; x=window.screenLeft; y=window.screenTop; windowmove(); } function windowmove(){ if(x<0||x>w){ s=-s; } x=x+s; if(y<0||y>h){ v=-v; } y=y+v; mywindow.moveTo(x,y); setTimeout(windowmove,10); } </script> </head> <body> <input type="submit" value="打开窗口" id="windowOpen" onclick="windowOpen()"> </body> </html> （编辑：济源站长网） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |
