××校招：前端线上笔试题--页面中的一个元素（10px*10px）围绕坐标(200, 300) 做圆周运动
<html>
<head>
<style type="text/css">
.item{
width:20px;
height:20px;
border-radius:10px;
background: blue;
position: absolute;
}/*border-radius圆角半径*/
#point{
left:95px;
top:295px;
}
#centre{
left:195px;
top:295px;
}
.circle{
width:200px;
height:200px;
border:1px red solid;
border-radius:100px;
position: absolute;
top:200px;
left:100px;
}
</style>
</head> <body>
<div id="point" class="item"><big>   RUN!Lamborghini</big></div>
<div id="centre" class="item"></div>
<div class="circle"></div>
</body> <script type="text/javascript">
var r = 100; //半径
var a = 0; //角度
var obj = document.getElementById('point');//js必须写在<body>后面，否则obj=null；
// 基点坐标为200,300
setInterval(function(){
obj.style.left = (190 - Math.cos(a) * r) + 'px';/*style 很重要*/
obj.style.top = (290 - Math.sin(a) * r) + 'px';
a += 0.1; //角度随时增大，产生绕圈的效果
}, 50);//every 50/1000s run function() one time;
</script> </html>
效果如下：
××校招：前端线上笔试题--页面中的一个元素（10px*10px）围绕坐标(200, 300) 做圆周运动的更多相关文章
- 请让页面中的一个元素（10px*10px）围绕坐标(200, 300) 做圆周运动
<!DOCTYPE html> <html> <head> <title>Making things move</title> <me ...
- 获取页面中任意一个元素距离body的偏移量
//offSet:等同于jQuery中的offSet方法,获取页面中任意一个元素距离body的偏移量function offSet(curEle) { var totalLeft = null; va ...
- js在页面中添加一个元素 —— 添加弹幕
参考地址 [往下拉 —— 使用HTML DOM appendChild() 方法实现元素的添加 ] 一.创建 HTML <div class="right_liuyan"&g ...
- (一)在HTML页面中实现一个简单的Tab
在HTML页面中实现一个简单的Tab 为了充分利用有限的HTML页面空间,经常会采用类似与TabControl的效果通过切换来显示更多的内容.本文将采用一种最为简单的方法来实现类似如Tab页切换的效果 ...
- 分别应用include指令和include动作标识在一个jsp页面中包含一个文件。
分别应用include指令和include动作标识在一个jsp页面中包含一个文件. hello.jsp <%@ page language="java" import=&qu ...
- 在某网站的登录页面登录时如果选择“记住用户名”,登录成功后会跳转到一个中间层（页面代码将登录的用户名和密码存在cookie）,中间页面中存在一个超链接，单击超链接可以链接到第三个页面查看信息。若选择“
Response实现登录并记录用户名和密码信息 在某网站的登录页面登录时如果选择"记住用户名",登录成功后会跳转到一个中间层(页面代码将登录的用户名和密码存在cookie),中间页 ...
- jquery[siblings]取得一个包含匹配的元素集合中每一个元素的所有唯一同辈元素的元素集合
取得一个包含匹配的元素集合中每一个元素的所有唯一同辈元素的元素集合,用于筛选同辈元素的表达式 $("#pageList").click(function(){ $(this).pa ...
- jquery中修改一个元素的值或内容
jquery中修改一个元素的值或内容,比如数值增加可以使用这个方法取得原值并+1 $this.text(function(i,ot){return Number(ot)+1;});
- PHP的排列组合问题 分别从每一个集合中取出一个元素进行组合，问有多少种组合？
首先说明这是一个数学的排列组合问题C(m,n) = m!/(n!*(m-n)!) 比如:有集合('粉色','红色','蓝色','黑色'),('38码','39码','40码'),('大号','中号') ...
随机推荐
- 几个更新(Update声明)查询方法
积极 文化: 上的方法,数据库更新Update.的标准格式:Update 表名 set =值 where 条件只是依据数据的来源不同,还是有所差别的: 1.从外部输入这样的比較简单例:update ...
- .NET 对象序列化和系列化德
DataSet ds = new DataSet(); //给ds赋值(省略) byte[] b = this.Serialize(ds); DataSet d1 = this.DeSerialize ...
- mysql 的load data infile要使用
LOAD DATA INFILE从文本文件中读出的声明以极高的速度到表. 1.基本语法 LOAD DATA [LOW_PRIORITY | CONCURRENT] [LOCAL] INFILE 'fi ...
- ASP.NET——RequiredFieldValidator控制和ValidationSummary控制
我们的登录页面,忘记承担损失password然后username,该页面将永远是一个小提醒. 那么我们在网也制作的时候怎样实现这一功能呢?这就用到了RequiredFieldValidator控件和V ...
- Android 数据库加密
一 一个简短的引论 SQLite是一个轻量的.跨平台的.开源的数据库引擎.它的读写效率.资源消耗总量.延迟时间和总体简单性上具有的优越性,使其成为移动平台数据库的最佳解决方式(如Android.i ...
- sql server 查看表的行数
SELECT a.name , b.[rows]FROM dbo.sysobjects AS a LEFT JOIN sysindexes AS b ON a.id ...
- 日积月累系列之国籍控件（js源码）
一直苦于没有好的国籍控件可以用,于是抽空写了一个国籍控件,现分享给大家. 主要功能和界面介绍 国籍控件主要支持中文.英文过滤以及键盘上下事件. 源码介绍 国籍控件核心是两个文件,navtionalit ...
- nginx 查看并发连接数
这里仅仅说一下用命令查看(也可配置页面) 通过查tcp连接数 1.netstat -n | awk '/^tcp/ {++S[$NF]} END {for(a in S) print a, S[a]} ...
- 快速构建Windows 8风格应用8-贴靠视图
原文:快速构建Windows 8风格应用8-贴靠视图 本篇博文主要介绍如何切换出贴靠视图.关于贴靠视图的设计.关于贴靠视图的应用程序栏和如何实现贴靠视图. 如何切换出贴靠视图 第一步:水平方向全屏视图 ...
- Pythonic论坛怪怪的’居民’显示[已解决]
之前使用Pythonic搭建的论坛people界面显示有点问题 第一个用户不显示,问了下作者,作者回复说这个Link只有~/people/而没有用户名 就点到为止了. 按说我使用syncdb同步时注册 ...