<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style>
            html,body{
                margin:0;
                padding:0;
                width:100%;
                height:100%;
            }
            #box{
                width:1200px;
                height:700px;
                position: absolute;
                top:50%;
                left:50%;
                margin-top:-350px;
                margin-left:-600px;
            }
            span{
                display:block;
                width:300px;
                height:60px;
                line-height: 60px;
                font-size:30px;
                color:#FF0000;
                position: absolute;
                top:50%;
                left:50%;
                margin-top:-30px;
                margin-left:-150px;
            }
            input{
                width:40px;
                height:20px;
            }
            #btnY{
                position: absolute;
                top:400px;
                left:500px;
            }
            #btnN{
                position: absolute;
                top:400px;
                left:580px;
            }
        </style>
    </head>
    <body>
        <div id= "box">
            <span>Do you love me ?</span>
            <input type="button" value="yes" id="btnY"/>
            <input type="button" value="no" id="btnN"/>
        </div>
    </body>
</html>
<script>
    var oBtnY = document.getElementById("btnY");
    var oBtnN = document.getElementById("btnN");
    oBtnY.onclick = function(){
        alert( "哈哈，我也喜欢你" )
    }
oBtnN.onmouseover = function(){
oBtnN.style.left = Math.floor(Math.random()*700)+"px";
oBtnN.style.top = Math.floor(Math.random()*700)+"px";
}
    function haha(){
oBtnN.style.left = Math.floor(Math.random()*700)+"px";
oBtnN.style.top = Math.floor(Math.random()*700)+"px";
}
</script>

随机推荐

  1. npx：npm包执行器

    npx 作用: 单次执行命令而不需要安装到本机 执行依赖包里的二进制文件 使用不同版本的 node 利用 npx 可以下载模块这个特点,可以指定某个版本的 Node 运行脚本.它的窍门就是使用 npm ...

  2. ssh证书免认证登录

    思路: 客户端私钥存放于客户端,/root/.ssh/id_rsa 将客户端公钥存放于要远程控制服务器上:将客户在公钥id_rsa.pub内容追加到 /root/.ssh/authorized_key ...

  3. ElasticSearch（七）管理ES

    发现,故障修复以及恢复 在发现节点,主要是使用ES的zen模块来进行发现,发现的目的就是加入集群,zen的发现有两种模式分别是单播和组播,单播是指配置好了要发现的节点IP,组播则是指不配置具体IP,向 ...

  4. jmeter --- 搭建持续集成接口测试平台(Jenkins+Ant+Jmeter)

    jmeter --- 搭建持续集成接口测试平台(Jenkins+Ant+Jmeter) 一.环境准备: 1.JDK:http://www.oracle.com/technetwork/java/jav ...

  5. ionic 监听页面滚动，点击停止滚动

    类似今日头条,页面上有很多card,点击每个card跳转该card的详情页面.这里有一个问题,当我滚动页面时,会先后触发touchstart.touchmove.touchend,但是当touchen ...

  6. oracle rename数据文件的两种方法

    oracle rename数据文件的两种方法 2012-12-11 20:44 10925人阅读 评论(0) 收藏 举报  分类: oracle(98)  版权声明:本文为博主原创文章,未经博主允许不 ...

  7. 【maven】之打包不带版本号的问题

    今天在写maven项目的时候发现打包没有带版本号,只有包名 百思不得其解,我翻看之前的项目发现并没有这种情况,最后看了一下文档 发现是自己在build中写了fileName  导致的!删除自定义的fi ...

  8. Windows下利用TortoiseSVN搭建本地SVN服务器

    写在前面: 安装TortoiseSVN时,图中这步要选择,才能同时安装后面需要的svnserve.exe 环境说明: Win 7 TortoiseSVN 1.7 搭建步骤: 0. 新建一个目录,做&q ...

  9. 【转】探索 ConcurrentHashMap 高并发性的实现机制

    原文链接:https://www.ibm.com/developerworks/cn/java/java-lo-concurrenthashmap/  <探索 ConcurrentHashMap ...

  10. Hadoop 管理工具HUE配置-集成Unix用户和用户组

    HUE安装完成之后,第一次登录的用户就是HUE的超级用户,可以管理用户,等等.但是在用的过程发现一个问题这个用户不能管理HDFS中由supergroup创建的数据. 虽然在HUE中创建的用户可以管理自 ...