js小项目
关注
分享
扫一扫
菜到不会下载软件
安装软件真的难
展开
-
JavaScript小项目 画布
08-Fun with HTML5 Canvas主要功能是能够在页面中画曲线，并且颜色是在不断地变化的项目描述：项目代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>HTML5 Canvas</title></head><body> <canvas id="draw".原创 2022-05-08 14:46:55 · 286 阅读 · 0 评论 -
JavaScript小项目 06-Type Ahead 头部搜索
06-Type Ahead主要的功能是在搜索的时候，页面能够实时的显示出相应的结果，并且输入的内容会高亮的显示出来效果图：主要代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Type Ahead 👀</title> <link rel="stylesheet" href="style.css..原创 2022-05-08 11:55:27 · 429 阅读 · 0 评论 -
JavaScript小项目 05-Flex Panel Gallery
05-Flex Panel Gallery通过使用flex布局的方式，来在页面中当点击的时候会出现点击该图片的扩展效果，在这里主要练习了css的样式，对于flex布局有了一些了解效果图：主要代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Flex Panels 💪</title> <link..原创 2022-05-08 11:52:34 · 376 阅读 · 0 评论 -
JavaScript小项目03-CSS Variables
03-CSS Variables功能主要就是当鼠标滑动的时候，改变相应的边框值、清晰度以及背景颜色效果图：主要代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Scoped CSS Variables and JS</title></head><body> <h2>Up.原创 2022-05-08 11:49:40 · 268 阅读 · 0 评论 -
JavaScript小项目-02Js and CSS Clock
主要的功能就是写出来一个时钟表盘，分别显现出时分秒的指针，秒针是让他每过一秒就跳动一次，分针则是没过69秒跳动一次；我在原有的基础上添加了所有的数字，这样看起来更加的舒适主要效果图：主要的代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=ed..原创 2022-05-08 11:46:51 · 183 阅读 · 0 评论 -
javaScript的一些小项目01-Drum Kit架子鼓
01-Drum Kit架子鼓：说明：这主要的功能是：1、当我在键盘上按下相应的按键，他就会发出相应的声音2、当按下去的时候会有高亮的效果3、状态需要恢复到原来的状态主要效果图预览：主要代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>JS Drum Kit</title> <..原创 2022-05-08 11:42:11 · 430 阅读 · 1 评论 -
扫雷小游戏
写了一个小游戏，扫雷<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>扫雷</title> <link rel="stylesheet" href="原创 2022-02-05 23:59:13 · 1747 阅读 · 0 评论 -
贪吃蛇进阶版本（javascript）
昨天写了一个贪吃蛇的小游戏，在写完之后，因为自己平时喜欢打王者荣耀这一类的游戏，所以在想能否将这个游戏进阶一下，当完成一定的要求之后，他就晋级。于是写了下面的代码：示例图如下：这个是贪吃蛇初级版本：这是贪吃蛇高阶版本：这个是当贪吃蛇最终通关过后的版本：他会有一个动态的烟花效果：下面是代码：初级贪吃蛇：<!DOCTYPE html><html lang="en"><head> <meta charset="U.原创 2022-02-03 00:04:32 · 3443 阅读 · 0 评论