- 博客(14)
- 资源 (3)
- 收藏
- 关注
RSS订阅
原创 JQuery极果商城项目实战（附完整代码）
JQuery极果商城前端页面效果图技术点HTML页面结构CSSreset.csscommon.cssindex.cssJavaScriptJQueryjson效果图技术点本次项目实战尽可能的动态还原了极果商城的首页部分，使用到的前端知识包括HTML+CSS页面布局、元素浮动与清除浮动、轮播图的动画逻辑、Ajax异步请求数据、json数据编写HTML页面结构<!DOCTYPE html><html lang="en"><head> <meta
2020-11-12 08:38:12
5296
2
原创 小米官网前端页面还原
小米官网前端页面还原网页效果图片HTMLcss初始化样式外部样式文件网页效果图片HTML<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>小米商城-小米10 Pro、Redmi
2020-11-08 11:20:03
2594
9
原创 前端控制台报Uncaught SyntaxError: Unexpected token u in JSON at position 0错误
前端控制台报Uncaught SyntaxError: Unexpected token u in JSON at position 0错误报错展示报错原因我们在使用JSON.parse()方法 处理后端传来的json格式数据时，有时控制台会报如下的错误报错展示报错原因造成这个错误的原因是JSON.parse()解析了一个undefined数据，换句话说就是后端传回来的数据值不是一个json格式数据，而是一个值为undefined的数据。想要消除这个error，就需要检查是什么原因造成了请求来的值
2021-04-07 15:14:24
1414
原创 原生JS3D拖拽相册
原生JS3d拖拽相册效果展示主要逻辑代码详解效果展示通过鼠标拖拽可以旋转展示图片主要逻辑 实现整体的3D效果主要使用两条属性：preserve-3d，3D效果， perspective，场景景深 做到拖拽特效分为三个步骤，鼠标按下事件，鼠标移动事件，鼠标抬起事件 从开始拖拽到结束拖拽，还要获得鼠标位于页面所在的开始坐标和结束坐标，再将拖拽过程中的坐标更新就完成了项目整体逻辑代码详解<!DOCTYPE html><html lang="en"><head
2021-03-06 05:11:02
457
原创 css3关键帧动画+伪元素实现心动特效
css3关键帧动画+伪元素实现心动特效效果图代码详解效果图知识点： 关键帧动画animation设置元素运动属性值 利用元素的前后伪元素设置旋转角度将元素拼凑成爱心形状代码详解<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
2021-03-04 17:49:25
428
1
原创 原生JS记忆翻牌小游戏
原生JS记忆翻牌小游戏游戏截图游戏逻辑代码详解htmlcssjavascript游戏截图游戏逻辑游戏规则：在被分成16个方格的小方块下面有被随机打乱分配的8对图片，使用鼠标点击方格将图片翻转，若连续两次翻转的图片相同，则该组图片翻转成功，若连续两次翻转的图片不一样，则两张图片会在0.3秒后自动翻转回方格，当8对图片全部被翻转成功则游戏胜利。主要逻辑： 定义一个数组，将其用Array.sort()方法进行乱序处理 根据得到的乱序数组将图片进行洗牌，分配到不同的方块下隐藏 根据以上得到的图片排
2021-03-02 20:09:21
3525
3
转载 Flex布局学习笔记详解
Flex布局学习笔记Flex布局是什么Flex布局概念Flex容器的属性1、flex-direction属性2、flex-wrap属性3、flex-flow4、justify-content属性5、align-items属性6、align-content属性Flex项目属性1、order属性2、flex-grow属性3、flex-shrink属性4、flex-basis属性5、flex属性6、align-self属性Flex布局是什么Flex全称为 Flexible Box 意为 弹性布局相比于传统布局
2020-12-11 09:57:24
606
原创 web淘宝电商页面搭建
web淘宝电商页面搭建点击此处下载完整代码图片效果展示首屏内容次屏内容整体代码并不包含JavaScript部分，因此页面为静态页面，但代码包含了淘宝网的鼠标触发事件。
2020-08-26 10:59:56
975
原创 原生JS验证码登录界面
原生JS验证码登录界面效果图html页面结构css页面样式JavaScript页面行为效果图html页面结构页面的结构以input、label、canvas等标签组成<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"&
2020-08-20 15:52:45
1114
原创 css3D立方体旋转动画
css3旋转立方体效果图html立方体结构css3立方体样式效果图html立方体结构整个立方体的结构分为六个正方形面，所以需定义六个div结构来表示立方体的六个平面，再用css3的transform属性移动六个平面组成3D的立方体结构<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width
2020-08-17 16:16:14
742
原创 图片悬停特效
鼠标触发图片悬停特效html页面结构css页面样式本篇文章介绍的是一个鼠标触发的hover悬停特效，鼠标放在图片上，图片旋转一周。涉及到的知识点包括css伪元素、css3动画特效、css3的transform方法、css浮动、定位等。样图如下：html页面结构整个页面结构在一个父级div下，其下的八个类名为item的div下分别包含一个img标签，从而引入图片<body> <div class="wrapper"> <div class="it
2020-08-16 09:30:33
810
原创 原生JS音乐歌词播放页面
原生JS音乐歌词播放页面html页面结构css页面样式JS页面行为歌词高度计算图html页面结构整个页面的结构分为音乐播放部分和歌词滚动部分。两部分放在一个div标签下。音乐文件采用audio标签引入放在页面顶端，歌词文本放入div>ul>li嵌套标签<!DOCTYPE html><html><head> <title>原生JS音乐歌词滚动</title> <link rel="stylesheet" type="t
2020-08-14 12:58:09
699
原创 jQuery-验证码登录框
jQuery实现生成随机验证码登录框概述HTML结构CSS样式JS行为生成验证码组成数组创建画布生成并写入验证码添加鼠标点击时间及css样式效果展示概述本篇文章给前端新手介绍一个用jQuery实现的随机六位验证码登录框HTML结构结构大体分为三个部分，首先是三个输入框输入用户名、密码和验证码。第二部分为canvas画布生成验证码以及刷新按钮。第三部分为提交按钮<!DOCTYPE html><html><head> <title>验证码登录4&l
2020-05-24 15:58:55
1998
原创 web前端动态环形时钟demo练习
动态环形时钟动态环形时钟demo练习结构（HTML）样式（CSS）行为（JavaScript）动态环形时钟demo练习本篇文章用到的知识点包括canvas画布及画笔使用、css绝对定位居中布局、日期对象的使用、颜色环形渐变填充以及定时器函数的使用等知识点。欢迎各位读者下方评论中指出文章错误或提出改进意见若js函数中有笔者未说明的或为还有未清楚的问题可自行查阅w3cschool标准附上链接 link.结构（HTML）结构非常简单，只在canvas画布上操作即可,给画布一个500*500的大小&l
2020-05-20 14:05:16
519
小米官网前端代码.rar
2021-03-05
淘宝电商页面.rar
2020-08-25
pyv8-win64-p3-master.zip
2020-08-16
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人