Web 前端
关注
分享
扫一扫
{}
coffee_cold
又黄、又焖、又辣鸡
展开
-
JavaScript - demo - 鼠标画线
源代码（需要自行导入jQuery文件，当然你也可以自行修改代码，解除其对jQuery的依赖，鄙人暂时太懒不想做）：<html> <head> <style> .pointer { width:2px; height:2px; background:black; position:absolute; border-radius:50%; } #pointerArea { width:100%;原创 2021-06-10 09:40:37 · 489 阅读 · 1 评论 -
JavaScript - demo - 两点之间画线
代码：<html> <head> </head> <body> <script> var f; window.onmousedown = function(e) { if (undefined == f) { f = { x : e.clientX, y : e.clientY } createPointer(f.x, f.y); return;原创 2021-06-10 09:33:16 · 3191 阅读 · 0 评论 -
JavaScript-幸运转盘-抽奖
source code:<html> <head> <meta charset='utf-8'> <title>幸运转盘</title> <style> .main { width:600px; margin:0 auto; background:rgb(233, 233, 233, 0.7); } .top { padding:10px 10px; }原创 2021-03-19 16:20:14 · 334 阅读 · 0 评论 -
html-css-轮播图
source code:<html> <head> <style> .main { width:500px; height:270px; background:gray; overflow:hidden; margin:0 auto; } .list { width:1500px; height:100%; position:relative; } .partA {原创 2021-03-16 11:56:27 · 131 阅读 · 0 评论 -
JavaScript-demo-圆形碰撞检测
source code:<html> <head> <style> #circleA { background:red; width:100px; height:100px; border-radius:50px; position:absolute; } #circleB { background:green; width:100px; height:100px; bo原创 2021-03-12 10:08:17 · 486 阅读 · 0 评论 -
JavaScript-demo-指针时钟
source code:<html> <head> <style> #mainArea { width:200px; height:200px; border-radius:100px; background:gray; margin:0 auto; margin-top:300px; transform:rotate(90deg); } #houre { position:re原创 2021-03-11 16:07:58 · 126 阅读 · 0 评论 -
JavaScript-demo-网页版金山打字
source code:<!DOCTYPE html><html ><head> <meta charset="UTF-8"> <title></title> <style> input { outline :none; padding-left:10px; } * { margin: 0; padding: 0; } body {原创 2021-03-10 16:16:02 · 850 阅读 · 1 评论 -
JavaScript-demo-数字时钟
source code:<html> <head> <style> #timeArea { width:400px; height:75px; line-height:75px; font-size:50px; text-align:center; background:; color:green; margin:0 auto; } #dateArea { wi原创 2021-03-10 14:15:18 · 115 阅读 · 0 评论 -
JavaScript-demo-第三方组件-高德地图
[前提：想要正确运行demo项目，请自行准备jQuery，并将其替换掉下面源代码中jQuery的路径]source code:<!DOCTYPE html><html> <head> <style> #container { width: 100%; height: 600px; } .near-box{ max-width: 640px; overflow: hidden; marg原创 2021-03-09 17:29:26 · 221 阅读 · 0 评论 -
JavaScript-demo-方块赛跑
source code:<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body > <div style='width:2100px; border-bottom: 3px solid black; margin-top:20px;'></div>...原创 2021-03-09 17:08:47 · 140 阅读 · 0 评论 -
JavaScript-demo-随机点名-读取文件
小demo支持动态加载指定的数据文件，但是数据文件的内容需要格式如下：source code:<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style> #nameArea { width:400px; background:black; text-align: .原创 2021-03-09 17:04:37 · 211 阅读 · 0 评论 -
JavaScript-demo-方块射击
source code:<!DOCTYPE html><html> <head> <style> .bullet { width:10px; height:10px; background:green; background-size:100% 100%; position:absolute; border-radius : 5px; } .army { pos原创 2021-03-09 16:55:31 · 191 阅读 · 0 评论 -
JavaScript-demo-碰撞检测-矩形
source code:<html> <head> </head> <body style='height:1000px;'> <div id='redDiv' style='width:80px; height:80px; background:red; position:absolute; top:400px; left:800px;'></div> <div id='greenDiv' sty...原创 2021-03-09 16:46:40 · 142 阅读 · 0 评论 -
前端 - bootstrap
# model弹窗的使用<!-- 在html代码中配置model弹窗 --><input id="btntext" type="button" value="something"data-toggle="modal" data-target="#myModal" href="../SysManage/ZuJianManage.aspx"/><!-- Modal --><div class="modal hide fade"id="myModal"...原创 2020-07-19 19:44:24 · 85 阅读 · 0 评论 -
前端 - javascript
# 对字符串中的中文进行转义，一般用作URL传参上var name='中文';escape(name);// 对字符串转义unescape(name); // 转义字符串解码原创 2020-07-19 19:34:09 · 89 阅读 · 0 评论 -
前端-jQuery
$('#组件ID').hide(); //不显示，但内容(即各个节点还在)，其原理应该是通过display属性来实现的$('#组件ID').remove(); //彻底删除，不显示，内容消失获取指定单选按钮组中被选择的单元$("input:radio[name='单选组名称']:checked") ---获取value值.val()获取指定select组件中被选中的单元$('...原创 2019-04-13 20:13:03 · 175 阅读 · 0 评论 -
前端-HTML组件
textarea 开始标签与结束标签直接不能有空格和回车，不然会异常原创 2019-04-13 19:57:41 · 300 阅读 · 0 评论 -
前端-Img组件图片的动态修改
最近在写前端时遇到这样的需求:通过选定本地图片来更改前端用户头像，就当前所了解的js或者jQuery调用，似乎没有可以直接更带组件背景的调用，进过网上查找后获得如下解决办法。（暂时只能修改Img组件的背景，还未尝试其他组件)<html><head><title>Img组件动态修改</title></head><b...原创 2019-04-13 19:53:19 · 1191 阅读 · 0 评论