JS
文章平均质量分 50
知识进脑的肖老千啊
还不快到碗里来??
展开
-
JavaScript之长图滚动
JavaScript之长图滚动长图的滚动会涉及定时器:我们先来回顾下定时器:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>定时器回顾</title></head><body> <button id="start">开启</button> <butto原创 2021-04-27 20:11:51 · 354 阅读 · 0 评论 -
JavaScript之点击改变图片形状(transform的应用)
JavaScript之点击改变图片形状(transform的应用)附上代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>transform的运用</title> <style type="text/css"> #box{ width: 50px;原创 2021-04-27 19:18:31 · 1324 阅读 · 0 评论 -
JavaScript之日期特效
JavaScript之日期特效直接上代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style type="text/css"> *{ padding: 0; margin: 0; }原创 2021-04-27 19:14:25 · 270 阅读 · 0 评论 -
JavaScript之根据所选排列方式进行排列
JavaScript之根据所选排列方式进行排列有两种方式,第一种:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>九宫格布局</title> <style type="text/css"> *{ padding: 0; margin: 0;原创 2021-04-27 19:10:43 · 172 阅读 · 3 评论 -
JavaScript之评论的发布
JavaScript之评论的发布话不多说直接上代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>发布评论</title> <style type="text/css"> *{ padding: 0; margin: 0; }原创 2021-04-27 19:04:05 · 483 阅读 · 0 评论 -
JavaScript之随机码的生成与校验
JavaScript之随机码的生成与校验由于获取事件源有两种写法,所以在此处都附上:这个是直接用var去定义的<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>随机验证码校验</title> <style type="text/css"> #code{ width:原创 2021-04-27 18:31:30 · 228 阅读 · 2 评论 -
JavaScript之上传图片验证
JavaScript之上传图片验证话不多说直接上代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>上传图片验证</title></head><body> <label for="file">上传图片格式验证</label> <input type="原创 2021-04-27 18:20:34 · 324 阅读 · 0 评论 -
JavaScript之表单验证判断成绩
JavaScript之表单验证判断成绩话不多说直接上代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>表单校验</title> <style type="text/css"> *{ padding: 0; margin: 0;原创 2021-04-27 18:12:00 · 688 阅读 · 0 评论 -
JavaScript之全选和取消全选及反选所有框
JavaScript之全选和取消全选及反选所有框话不多说直接上代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>音乐盒</title> <style type="text/css"> *{ padding: 0; margin: 0;原创 2021-04-27 16:41:10 · 252 阅读 · 0 评论 -
JavaScript之切换背景图片(并使)背景栏保持和背景色调相似
JavaScript之切换背景图片(并使)背景栏保持和背景色调相似话不多说直接上代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>百度换肤</title> <style type="text/css"> *{ padding: 0; mar原创 2021-04-27 16:24:58 · 705 阅读 · 0 评论 -
JavaScript之图片切换(类似淘宝商品图切换)
JavaScript之图片切换下边给出几种方法进行图片切换:方法一(小白专用款!简单易懂) 下边附上代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>图片切换2</title> <style type="text/css"> *{ padding: 0;原创 2021-04-23 12:49:40 · 3224 阅读 · 1 评论 -
JavaScript之衣服相册切换效果(类似淘宝商品图切换)
JavaScript之衣服相册切换效果(类似淘宝商品图切换)话不多说,直接上代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style type="text/css"> #bigImg{ width: 200px;原创 2021-04-21 20:38:51 · 681 阅读 · 0 评论 -
JavaScript之显示和隐藏图片
JavaScript之显示和隐藏图片点击按钮可以显示和隐藏图片(默认显示),附上代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>显示和隐藏图片</title></head><body> <button id="btn">隐藏</button> <b原创 2021-04-21 20:30:52 · 2593 阅读 · 0 评论 -
JavaScript之图片切换功能
JavaScript之图片切换功能为了实现如下图片构造(点击上一张显示上一张图片,点击下一张显示下一张图片),我们写了如下代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>图片切换</title> <style type="text/css"> /*控制图片大小*/ #f原创 2021-04-21 17:38:22 · 692 阅读 · 0 评论 -
JavaScript的DOM之鼠标悬浮事件
JS的DOM之鼠标悬浮事件鼠标悬浮事件之onmouseover()和onmouseout()事件这里用大白话介绍一下最简单的原理:就是当鼠标在这块区域时候会触发相应事件,将鼠标挪开则恢复原先事件附上代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>鼠标悬浮事件onmouseover()和onmouseout()事件</tit原创 2021-04-21 16:33:16 · 12261 阅读 · 0 评论