<!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. node 各模块及对应功能

    node 各模块及对应功能 node 模块 对应功能 net 处理 TCP dgram 处理 UDP http 处理 HTTP/1 http2 处理 HTTP/2 https 处理 HTTPS tls ...

  2. dva 知识点

    dva中,路由模式从hashHistory换成 browserHistory: dva-cli创建的项目中,src/index.js相应部分修改如下: import browserHistory fr ...

  3. mysql查询各个知识点

    临时表 group by http://www.ywnds.com/?p=10174 https://blog.csdn.net/wuseyukui/article/details/72627667 ...

  4. Hadoop Mapreduce 案例 wordcount+统计手机流量使用情况

    mapreduce设计思想 概念:它是一个分布式并行计算的应用框架它提供相应简单的api模型,我们只需按照这些模型规则编写程序,即可实现"分布式并行计算"的功能. 案例一:word ...

  5. MapReduce实现与自定义词典文件基于hanLP的中文分词详解

    前言: 文本分类任务的第1步,就是对语料进行分词.在单机模式下,可以选择python jieba分词,使用起来较方便.但是如果希望在Hadoop集群上通过mapreduce程序来进行分词,则hanLP ...

  6. 外同步信号检测---verilog---状态机

    外同步信号检测---verilog---状态机 `timescale 1ns / 1ps /////////////////////////////////////////////////////// ...

  7. 初次使用CentOs7遇到的问题

    初次使用CentOs7遇到的问题 1.XXX[用户名]不在sudoers文件中.此事将被报告 解决方案:CentOs自带命令visudo,其作用为调用vim来修改“/etc/sudoers”文件,从而 ...

  8. linux与Windows使用编译区别及makefile文件编写

    一.Windows与:Linux嵌入式开发区别 Windows下编辑.编译.执行 编辑: sourceInsight:ADS: 编译:指定链接地址,指定链接顺序,编译 执行:烧写到单板再启动 Linu ...

  9. XE5 Android 开发数据访问手机端 解决乱码的办法 [转]

    经过测试,将sqlserver里的字段由varchar 或者char  改为  nvarchar 或者nchar 然后在手机端的clientdataset 增加字段的时候数据类型选择widestrin ...

  10. JDBC相关概念介绍

    一.JDBC相关概念介绍 1.1.数据库驱动 这里的驱动的概念和平时听到的那种驱动的概念是一样的,比如平时购买的声卡,网卡直接插到计算机上面是不能用的,必须要安装相应的驱动程序之后才能够使用声卡和网卡 ...