逗你玩

最新推荐文章于 2021-06-03 18:46:22 发布
最新推荐文章于 2021-06-03 18:46:22 发布
阅读量102 收藏
点赞数
分类专栏： HTML 文章标签： 按钮移动
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_30315259/article/details/78462797
版权
<!DOCTYPE html >
<html>


<head>
    <title>让你的生活充满爱</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />


    <script>
        var i = 0;
        function moveButton() {
            var trueDivPx = document.getElementById("trueDiv");
            var topPx = trueDivPx.style.top;
            var leftPx = trueDivPx.style.left;
            topPx = parseInt(topPx.substr(0, topPx.length - 2));
            leftPx = parseInt(leftPx.substr(0, leftPx.length - 2));
            if (i == 0 || i == 2 || i == 4) {
                trueDivPx.style.top = (topPx + 100) + "px";
                i++;
            } else if (i == 1 || i == 3 || i == 5) {
                trueDivPx.style.top = (topPx - 100) + "px";
                i++;
            } else {
                document.getElementById("trueButton").value = "是";
                document.getElementById("falseButton").value = "否";
            }
        }
        function moveButton2() {
            if (document.getElementById("falseButton").value == "否") {
                document.getElementById("trueButton").value = "否";
                document.getElementById("falseButton").value = "是";
                i = 0;
            }
        }
        function clickButton(){
            alert("你竟然选择单身一辈子？你对生活绝望了吗？\n生活不止眼前的苟且，还有诗和远方的苟且！\n别灰心少年，生活总是起起落落，还落，再落，一直落……");
            alert("所以，珍惜裆下吧，少年！即使是假装你的生活充满爱！");
        }


        function clickbeginButton(){
          
          document.getElementById("beginDiv").remove();
          document.getElementById("clickDiv").style.display="";
        }






    </script>
    <style>
        html {
            width: 100%;
            height: 100%;
        }


        body {
            background-color: #4169E1;
            font-size: 15px;
            font-family: "Arial", "Tahoma", "微软雅黑", "雅黑";
            line-height: 18px;
            padding: 0px;
            margin: 0px;
            text-align: center;
        }


        div.div1 {
          position: absolute;
            width: 40%;
            height: 40%;
            top: 0;
            font-weight: bold;
   color: #fff;
            left: 0;
            bottom: 0;
            right: 0;
            margin: 300px 400px 400px 400px;
        }
        .button{
width: 100px;
line-height: 38px;
text-align: center;
font-weight: bold;
color: #fff;
text-shadow:1px 1px 1px #333;
border-radius: 5px;
margin:0 15px 0px 0;
position: relative;
overflow: hidden;
        background-color:rgb(255, 251, 0);
}
        td.td1 {
            padding: 30px 0px 0px 0px;


        }




        .div2 {
            position: absolute;
            width: 40%;
            height: 40%;
            top: 0;
            font-weight: bold;
   color: #fff;
            
            left: 0;
            bottom: 0;
            right: 0;
            margin: 200px 400px 400px 400px;
            background-color: rgb(2, 109, 36);
        }
    </style>


</head>


<body>
  <div id="beginDiv" class="div1">  
      以人民的名义测试你！<br><br><br><br><br>
    <input type="button" class="button" name="beginButton" id="beginButton" value="开始测试"  οnclick="clickbeginButton()"> </div>
    <div class="div2" style="display: none;" id="clickDiv" >
        <div >
            <table align="center">
                <tr>
                    <td style="padding-top:20px ">
                        你是否想单身一辈子：
                    </td>
                </tr>
                <tr>
                    <td>
                        <div id="trueDiv" style="position:absolute;left:50px;top:130px">
                            <input type="button" class="button" name="trueButton" id="trueButton" value="否" οnmοuseοver="moveButton()" οnclick="clickButton()">
                        </div>
                    </td>
                    <td class="td1">
                        <div id="falseDiv" style="position:absolute;left:400px;top:130px">
                            <input type="button" class="button" name="falseButton" id="falseButton" value="是" οnmοuseοver="moveButton2()" οnclick="clickButton()">
                        </div>
                    </td>
                </tr>
            </table>
        </div>
    </div>
</body>


</html>
每米吃的耗子
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
逗你玩 自制整人小程序
10-15
逗你玩 自制整人小程序 桌面抖动过山车 逗你玩 自制整人小程序 桌面抖动过山车
HTML5逗你玩手机游戏.zip
07-11
"HTML5逗你玩手机游戏"这个主题表明我们将探讨如何利用HTML5来开发手机游戏。HTML5的引入极大地扩展了网页的功能，尤其是在移动设备上，它提供了丰富的媒体支持、离线存储、拖放功能以及新的表单元素等，为游戏...
逗你玩的运算符重载
wrz918的专栏
02-21 246
1.运算符重载的格式为 operator ()     2 不能重载的运算符有:          1.三目元运算符，即?和:           2域运算符：：           3类属关系运算符.           4sizeof运算符           5指针运算符*     使用运算符重载可以进行一些恶作剧，比如说下列代码#include u
自制桌面
grace_yan的专栏
07-07 687
 
小白逗你玩
weixin_45782393的博客
12-22 106
1 ESXi学习过程 第一次写，写的不太好。见谅 1.对于第一次学习esxi的同学，推荐去看VMwarevsphere虚拟化与云计算的书籍，在这里推荐王春海老师和何坤源老师的书籍，里面讲的很详细，里面从入门开始学习到自己搭建做实验，对学习很有帮助。 关于学习esxi踩过的坑 1.对于学习esxi来说，最重要的还是做实验，首先需要自己去下载VMware workstationz,这个软件是做实验的关键，这个是搭建虚拟机的一个入门，其次需要准备一些系统镜像， ...
6个html5手机游戏源码,html5逗你玩手机游戏源码
weixin_30678347的博客
06-03 1898
特效描述：html5 逗你玩 手机游戏源码。html5逗你玩小游戏，手机逗你玩游戏源代码。游戏介绍：老婆起床、买早餐、挤公交、下班、逛商场、喜当爹总共6个场景通关模式。逗你玩。代码结构1. 引入JS2. HTML代码逗你玩-蚂蚁社区_一个能够下载源码的神奇网站body, canvas, div {-moz-user-select: none;-webkit-user-select: none;-m...
注册表入门之作——逗你玩
weixin_34130389的博客
11-07 118
注册表入门之作——逗你玩 注册表很庞大，很复杂，我们认识他就可以用下面的实验来体会。经过对下面注册表的修改，你将看到，启动（Windows）系统时弹出一个对话框，，必须点确定才能进入系统，不然，就在系统之外等着吧。 请看以下详细操作展开“HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\Windows NT\Curre...
“猜数字”和“逗你玩”
gunqu_d的博客
07-17 427
一、猜数字 #define _CRT_SECURE_NO_DEPRECATE #define _CRT_SECURE_NO_WARNINGS 1 #include #include #include void menu() { printf("*******************************************\n"); printf("***********
百度逗你玩
weixin_30416871的博客
06-08 93
百度逗你玩 　　百度可真算是一张“网”。什么都忌，就犯傻不忌。先看看它的“个人中心”有些什么栏目： 　　除了“好友动态”有点用，其他的都傻得没救了,缺筋少脑的。“百度ＨＩ”来个东施效颦学人家ＱＱ，却没人卖帐去“ＨＩ”，步人后尘吃人家的臭屁，被数落是必然的。其实也不能怪百度傻，什么都忌了，还能玩什么？那就玩“找朋友”吧，但是又不能玩到脱裤子的份上，忌黄；那就玩“搭讪”吧，但是又不能玩到谈论国...
逗你玩-game
05-01
逗你玩 游戏源码----------------------------------------------------------------------------------------------------------------------------------
逗你玩手机HTML5游戏.zip
07-04
《逗你玩手机HTML5游戏》是一款基于HTML5技术开发的趣味小游戏，它以其独特的玩法和丰富的场景设计吸引着玩家。HTML5是现代网页开发的标准，它的核心优势在于跨平台性和丰富的媒体支持，使得游戏可以在多种设备上...
html5制作逗你玩手机游戏源码.zip
11-04
在这个"逗你玩"游戏中，Canvas可能被用来绘制游戏场景、角色和各种视觉效果。 Web Audio API则为游戏提供了高级音频处理能力，包括播放、暂停、音量控制、音效合成等功能。通过这个API，开发者可以创建复杂的音频...
马三立逗你玩台词.doc
10-11
6. **紧急情况处理**：遇到财物丢失或者可疑行为，应及时呼救，并清楚描述事件，如相声中小孩不断喊出“逗你玩”，虽然他并未理解情况的严重性，但在实际生活中，能准确描述事件和嫌疑人特征是非常重要的。...
C++程序—逗你玩
My Coding Life
07-11 744
ForeWord 这里是一个逗你玩的程序，要在60秒内输入“你是猪”，不然程序就会关机。 温馨提示：不要发给女朋友。。。Code以下是整蛊代码：#include<iostream> #include<stdlib.h> #include<string.h> #include<Windows.h> using namespace std;void douniwanFunc() { char
lxml-5.0.1-cp37-cp37m-win32.whl
08-31
lxml 是一个用于 Python 的库，它提供了高效的 XML 和 HTML 解析以及搜索功能。它是基于 libxml2 和 libxslt 这两个强大的 C 语言库构建的，因此相比纯 Python 实现的解析器（如 xml.etree.ElementTree），lxml 在速度和功能上都更为强大。 主要特性 快速的解析和序列化：由于底层是 C 实现的，lxml 在解析和序列化 XML/HTML 文档时非常快速。 XPath 和 CSS 选择器：支持 XPath 和 CSS 选择器，这使得在文档中查找特定元素变得简单而强大。 清理和转换 HTML：lxml 提供了强大的工具来清理和转换不规范的 HTML，比如自动修正标签和属性。 ETree API：提供了类似于 ElementTree 的 API，但更加完善和强大。 命名空间支持：相比 ElementTree，lxml 对 XML 命名空间提供了更好的支持。
slim-0.5.8-py3-none-any.whl
08-31
whl软件包，直接pip install安装即可
【赠】新营销4.0：新营销，云时代(PDF).pdf
最新发布
08-31
【赠】新营销4.0：新营销，云时代(PDF)
掌握Web程序设计：DOM事件与动态编程实例
alert("逗你玩的！"); }`，这样可以提高代码的可维护性和可复用性。 动态设置事件允许开发者在运行时动态地改变元素的行为，例如，可以将不同的函数绑定到双击事件上，通过`事件1">`和`事件2">`来实现。 window...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值