<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
*{
margin: 0;
padding: 0;
}
#div1{
width:150px;
height:200px;
background: pink;
position: absolute;
}
#div1 span{
width:30px;
height:60px;
background: deepskyblue;
position: absolute;
right:-30px;
top:60px;
}
</style>
<script>
window.onload=function(){
var oDiv1=document.getElementById('div1');
var timer="null"; oDiv1.onmousemove=function(){
move(0);
}
oDiv1.onmouseout=function(){
move(-150);
} function move(iTarget){
var oDiv1=document.getElementById('div1');
clearInterval(timer);
timer=setInterval(function(){
var speed;
if(oDiv1.offsetLeft>iTarget){
speed=-5;
}
else{
speed=5;
}
if(oDiv1.offsetLeft==iTarget){
clearInterval(timer);
}
else{
oDiv1.style.left=oDiv1.offsetLeft+speed+'px';
} },30);
}
}
</script>
</head>
<body>
<div id="div1">
<span>分享到</span>
</div>
</body>
</html>

分享到JavaScript的更多相关文章

  1. 【转发】网易邮箱前端技术分享之javascript编码规范

    网易邮箱前端技术分享之javascript编码规范 发布日期:2013-11-26 10:06 来源:网易邮箱前端技术中心 作者:网易邮箱 点击:533 网易邮箱是国内最早使用ajax技术的邮箱.早在 ...

  2. 技术分享|JavaScript的前世今生

    目录 一.什么是JavaScript 二.JavaScript的功能 三.JavaScript可以做什么 四.JavaScript框架 五.HTML,CSS和JavaScript 六.JavaScri ...

  3. [转载] 自定义百度网盘分享密码 (Javascript)

    压缩版 javascript:require(["function-widget-1:share/util/service/createLinkShare.js"]).protot ...

  4. 分享十个JavaScript在线调试工具

    测试Javascript可能是网页开发中最让人忧伤的工作.这里我找一些比较好的工具来帮助大家进行测试工作.这10款是我精选的基于浏览器的JavaScript在线调试工具,希望你们对你们有用. 1.Op ...

  5. 分享一个JavaScript嗅探工具Tracker

    今天发现一个好用的JS侦测工具,实时监测JS代码的使用效率,运行状态等. 期待插件作者添加更好的功能. 运行效果 运行效果如下(我把它放到标签里了): 1.点击Tracker书签工具 2.选择查看选项 ...

  6. JSONP分享-- 在JavaScript中跨域请求

    如果你正在开发一个现代的基于web的应用程序,那么你: 在客户端使用JavaScript. 需要集成那些没有完全在你控制之下的服务(或者那些来自不同的域). 在你的浏览器控制台中遇到过这个错误信息: ...

  7. 【前端分享】 JavaScript最经典的55个技巧(转)

    从别的地方看到的,保存下,有空实践下再补充. 1. oncontextmenu="window.event.returnValue=false" 将彻底屏蔽鼠标右键 <tab ...

  8. [分享]前端javascript插件(均开源)

    记录并分享一些自己使用过的插件,便于以后有相应的功能需要使用可以及时想到. 1:数字插件countUp.js 功能:用于动态显示数字的增加和减少 项目github地址:http://inorganik ...

  9. (Demo分享)利用JavaScript(JS)实现一个九宫格拖拽功能

    利用JavaScript(JS)实现一个九宫格拖拽功能   Demo实现了对任意方格进行拖拽,可以交换位置,其中Demo-1利用了勾股定理判断距离! Demo-1整体思路: 1.首先div实现自由移动 ...

随机推荐

  1. 本地Linux服务器上配置Git

    当我们需要拉取远程服务器代码到本地服务器时,我们首先要确定已经配置了正确的Git账号,可以从~/.gitconfig文件(为隐藏文件,需要使用ls -a查看),以及~/.ssh下的id_rsa.pub ...

  2. 如何用vue-cli初始化一个vue项目

    单文件组件和vue-loader 解析打包.vue文件 vue为了能够使我们在项目开发中对组件进行更好的维护,提供了一个单文件组件系统,vue把每一个独立的组件放在一个.vue的文件中,在这个文件中提 ...

  3. WPF项目学习.二

    WPF用MVVM的解决记录 版权声明:本文为博主初学经验,未经博主允许不得转载. 一.前言 记录在学习与制作WPF过程中遇到的解决方案.  焦点的控制,键盘事件触发,输入框的数字限制,异步处理,隐藏状 ...

  4. Hive metastore表结构设计分析

    今天总结下,Hive metastore的结构设计.什么是metadata呢,对于它的描述,可以理解为数据的数据,主要是描述数据的属性的信息.它是用来支持如存储位置.历史数据.资源查找.文件记录等功能 ...

  5. Windows 系统下安装 dig 命令

    dig是一个Linux下用来DNS查询信息的小工具,dig全称是Domain Information Groper,与nslookup类似,但比nslookup功能更强大.Windows只有nsloo ...

  6. PHP中的浮点精度和类型

    PHP中的浮点数 精度 在PHP中,浮点数的字长和平台相关,通常最大值是 1.8e308 并具有 14 位十进制数字的精度(64 位 IEEE 格式). 浮点数的精度有限.尽管取决于系统,PHP 通常 ...

  7. HTTP协议学习笔记

    一.什么是HTTP协议 HTTP协议是指计算机通信网络中两台计算机之间进行通信所必须共同遵守的规定或规则,超文本传输协议(HTTP)是一种通信协议,它允许将超文本标记语言(HTML)文档从Web服务器 ...

  8. selenium自动化测试学习(一)

    在学习selenium自动化测试前,我们需要先了解一点自动化测试的相关知识. (一)什么是自动化测试 (二)为什么要做自动化测试 (三)自动化测试优缺点 (1)什么是自动化测试 自动化测试是把以人为驱 ...

  9. Apache服务器安装-apache已经卸载,如何删除注册在系统的服务

    cmd进入windows的命令行客户端,执行:sc delete apache 注意:以管理员的身份删除,同理,此方法也可以删除其他类似的服务.例如sc delete MongoDB.

  10. 使用Websocket框架之GatewayWorker开发电商平台买家与卖家实时通讯

    前段时间公司提了一个新的需求,在商品的详情页要实现站内买家和商品卖家实时通讯的功能以方便沟通促成交易,要开发此功能当时首先考虑到的就是swoole和workerman了,从网上大概了解了一下关于这两款 ...