css
相信光的奥特王小懒
为未来而奋斗,为美好生活而拼搏。
展开
-
基于CSS的3D旋转画册的制作
3D旋转画册原创 2022-07-09 17:45:11 · 366 阅读 · 0 评论 -
JavaScript的学习与实践
1. 函数的学习案例:通过函数调用来判断2月的天数<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=ed原创 2022-05-24 09:27:51 · 588 阅读 · 38 评论 -
Echarts的学习和使用
1. 使用Echarts五部曲入门案例<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"&g原创 2021-09-10 14:37:07 · 162 阅读 · 0 评论 -
toDoList的做法
以下部分实现了将数据存储到本地的操作读取和存储本地数据的方法function getDate() { var data = localStorage.getItem("todolist"); if (data !== null) { // 本地存储里面的数据是字符串格式的 但是我们需要的是对象格式的 return JSON.parse(data); } else { retur...原创 2021-09-10 12:12:34 · 581 阅读 · 0 评论 -
jQuery的学习第一天
1. jQuery的下载即使用1.1 下载和引入下载后可自行在项目中创建一个js文件然后将内容复制粘贴。然后通过script引入我们所需要的html页面中。 <script src="jquery.min.js"></script>1.2 使用-简单的入口函数为了方便我们将script的位置可以随便书写,我们使用入口函数2. 顶级对象$书写方式有两种 $('div').hide(); jQuery('div').hide();3. DOM对象和jQue原创 2021-09-07 12:08:15 · 166 阅读 · 0 评论 -
发送验证码60s的时间限制
例如:哔哩哔哩网站上每次登录有一个验证码输入,且每次发送时间为60s的限制<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" ..原创 2021-09-06 09:24:37 · 415 阅读 · 0 评论 -
JavaScript中的Window常见对象(BOM)
1. 窗口加载事件使用上边的等式只能写一个,否则会按最后一个为标准;使用下边的等式可以写多个,所有的都不守影响。2. 调整窗口大小事件注意:常用于浏览器调整大小时,网页的页面内容显示。例如:京东页面全部展开为4列,缩小页面后从4列开始逐一隐藏。window.innerWitdh用于获取当前屏幕宽度。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> &原创 2021-09-05 17:53:24 · 194 阅读 · 0 评论 -
模拟京东快递单号查询
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>...原创 2021-09-05 16:30:03 · 543 阅读 · 0 评论 -
模拟京东按键输入案例(无论光标在什么位置,按s键即可将光标定位到搜索框)
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>..原创 2021-09-05 16:13:24 · 668 阅读 · 0 评论 -
获得鼠标坐标的方式以及相关的鼠标天使移动案例
鼠标坐标获取<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <tit.原创 2021-09-05 15:43:57 · 229 阅读 · 0 评论 -
动态生成表格
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>...原创 2021-09-02 17:34:00 · 188 阅读 · 0 评论 -
新浪微博下拉菜单案例
鼠标经过的时候,下拉内容显示;鼠标离开的时候,下拉内容隐藏。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content=.原创 2021-09-02 16:19:58 · 1982 阅读 · 2 评论 -
tab栏切换制作(点击那一栏显示那一栏的内容,其他栏的内容隐藏)
<style> * { margin: 0; padding: 0; } li { list-style-type: none; } .tab { width: 978px; margin: 100px auto; } ...原创 2021-09-02 10:52:57 · 319 阅读 · 0 评论 -
表单全选以及取消全选的制作
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> * { padding: 0; margin: 0; } .wrap { width:..原创 2021-09-02 10:08:23 · 211 阅读 · 0 评论 -
JavaScript制作表格隔行变色效果(新浪微博中的应用)
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>..原创 2021-09-02 09:55:53 · 483 阅读 · 0 评论 -
JavaScript实现百度换肤效果
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title&g...原创 2021-09-02 09:38:23 · 741 阅读 · 0 评论 -
密码框验证信息的案例
默认错误<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <...原创 2021-09-01 16:27:28 · 482 阅读 · 0 评论 -
网页中显示隐藏文本框内容
关于文本框的一些简单操作获得焦点的时候,text的value默认为空,然后输入我们想要的值;失去焦点的时候再显示原来的value值。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta.原创 2021-09-01 16:00:25 · 621 阅读 · 0 评论 -
购物页面点叉号二维码隐藏的做法
隐藏此二维码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <ti.原创 2021-09-01 15:27:56 · 526 阅读 · 0 评论 -
显示隐藏密码明文案例
核心思路如下:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <.原创 2021-09-01 11:23:12 · 541 阅读 · 0 评论