![](https://img-blog.csdnimg.cn/20201014180756918.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端入门案例
文章平均质量分 59
云杰8了
一入前端深似海
展开
-
自定义音视频控件
自定义音视频控件效果图如下实现原理音视频标签对象的属性和方法:1, 方法:`play()` `pause()`2. 属性: `currentTime` `duration`3. 事件:4. 音量的控制问题分析代码如下效果图如下实现原理在此你需要知道以下原理音视频标签对象的属性和方法:都是DOM对象的属性和方法1, 方法:play() pause()play()开始播放视频。pause() 暂停当前播放的视频。2. 属性: currentTime durationcurrentT原创 2021-04-21 19:49:00 · 322 阅读 · 3 评论 -
form表单验证
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=device-width, initial-scale=1.0" /> <.原创 2021-03-24 23:46:08 · 215 阅读 · 1 评论 -
jQuery动态粒子效果
效果图代码<!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"> <ti原创 2021-03-16 22:26:38 · 429 阅读 · 5 评论 -
JavaScript制作日历
效果图代码<!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"> <titl原创 2021-03-06 11:19:31 · 3154 阅读 · 18 评论 -
cookie案例---小米购物车历史记录(离线不可用)
效果图都是在线生成的。实现步骤1遍历数组对象生成商品信息定义一个商品信息数组var dataList = [{ imgSrc: "https://cdn.cnbj0.fds.api.mi-img.com/b2c-miapp-a1/413f5e2f-53e7-0879-119c-8b4466feea53.jpg?thumb=1&w=180&h=180", goodsName: "贝医生巴氏牙刷 ", price: "39.9元"原创 2021-01-25 22:25:55 · 2147 阅读 · 2 评论 -
cookie访问历史记录
需求1.进入页面 先判断cookie中有没有足迹信息1.1 有 取出 遍历之后放入到footprint中1.2 没有 就没有了呗2.在点击li时,产生一条历史访问记录2.1 将这条记录放入到cookie中, 数组[] 转json字符串 放入到cookie2.2 放入时应该判断是否存在 是的话,将原来的删除,新的放入 没有的话,直接放入2.3 历史记录是有长度显示的。 最多只能存放三条,当你放入第四条的时候,应该删除第一条。效果图如下代码如下JS代码function $(原创 2021-01-21 19:36:38 · 532 阅读 · 0 评论 -
JavaScript实现小米购物车功能案例
需求点击全选按钮,按钮全部被选中,结算价格发生变化 ,选中数量变化,取消全选,按钮全部取消选中,结算价格发生变化 ,选中数量变化。 点击单选按钮,按钮选中状态,结算价格发生变化 ,选中数量变化,取消按钮,结算价格发生变化 ,选中数量变化。 点击加号,小计变化,总数量变化。 点击减号,小计变化,总数量变化。 点击加入购物车新增一件商品,效果图如下代码如下HTML代码<!DOCTYPE html><html lang="en"><h...原创 2021-01-19 20:50:00 · 6750 阅读 · 14 评论