网页小Demo
文章平均质量分 69
一些网页动画特效
独鹿DT
这个作者很懒,什么都没留下…
展开
-
advancedresume高级简历
高级简历难度 ⭐️ 基本基本的HTML、CSS、JavaScript基础练习介绍通过实现一个个人网站,练习 HTML、CSS 的布局与样式,并可根据自我掌握情况简单实践 JavaScript可以参考线框图。用例描述:整个页面分为 6 大部分,每个部分又会细分为内部的小模块头部头部为线框图中最上面的一个横条,里面包含了个人姓名(或LOGO图),个人照片,锚点链接背景:背景为一个和浏览器窗口保持100%一样宽度的区域,颜色自行安排,可以是纯色,也可以尝试使用渐变色,或者使用一些 CSS 的高原创 2021-07-22 14:33:46 · 167 阅读 · 0 评论 -
WebMOOC 餐厅游戏
WebMOOC 餐厅游戏最近在写这个东西,也有几天了吧,平常的进度的化,大概两天之内可以完成了,先看一下大概的效果吧, ⭐️兴趣就私我吧。练习介绍难度 ⭐️ ⭐️ ⭐️ 需要具备基础知识通过实现一个类游戏的餐厅经营模拟,练习移动端 HTML 页面布局及样式实现。本练习中,要实现厨师、顾客以及你自己三个角色的关键操作,完成从顾客等位、点菜、烹饪、用餐、支付的一系列状态变更的数据、信息、交互、展现的变化及处理。可以参考原型图本练习提供的附件中,包括了开发本练习所需要的图片资源。用例描述:涉原创 2021-07-11 16:32:11 · 675 阅读 · 2 评论 -
ToDoList的实现
ToDoList的实现效果图需要有一个输入框,可以输入文本并添加到今日计划中.可以将今日计划勾选完成.可以删除指定的计划数据实现持久化,避免浏览器刷新后数据不丢失部分代码还是一样的,我就没提取出去做一个单独的函数了<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" conte原创 2021-07-11 00:29:16 · 1740 阅读 · 0 评论 -
CSS相应式卡包
CSS相应式卡包效果展示(大屏+小屏)代码实现HTMLCSS点击在线体验bilibili视频github地址效果展示(大屏+小屏)大屏小屏代码实现HTML<!DOCTYPE html><html lang="zh"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta原创 2021-04-24 13:43:23 · 776 阅读 · 16 评论 -
水波涟漪效果
水波涟漪效果效果展示代码实现HTML+JSCSS点击在线体验效果展示点击在线体验代码实现HTML+JS<!DOCTYPE html><html lang="zh"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="widt原创 2021-04-23 09:23:32 · 929 阅读 · 9 评论 -
购物车滑动卡片
购物车滑动卡片效果展示代码展示html代码css代码效果展示点击在线体验代码展示html代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=devi原创 2021-04-22 20:14:39 · 807 阅读 · 8 评论 -
视觉差滑动
视觉差滑动效果展示代码html代码css代码效果展示点击在线体验图示:点击在线体验代码html代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width原创 2021-04-21 23:21:35 · 849 阅读 · 6 评论 -
animation动画:奔跑的北极熊
奔跑的北极熊效果图(模仿以前百度浏览器背景制作)实现代码html部分<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title>原创 2020-09-27 17:29:05 · 1832 阅读 · 4 评论 -
常见网页特效案例:网页轮播图
常见网页特效案例:网页轮播图轮播图也称为焦点图,是网页中比较常见的网页特效。功能需求: 1.鼠标经过轮播图模块,左右按钮显示,离开隐藏左右按钮。 2.点击右侧按钮一次,图片往左播放一张,以此类推,左侧按钮同理。 3.图片播放的同时,下面小圆圈模块跟随一起变化。 4.点击小圆圈,可以播放相应图片。 5.鼠标不经过轮播图,轮播图也会自动播放图片。 6.鼠标经过,轮播图模块, 自动播放停止。效果:代码:js部分document.addEventListener('DOMC原创 2020-08-30 05:53:25 · 3754 阅读 · 0 评论