程序人生
课程方向: |
网页前端 |
课程类型: |
项目实战 |
本站资源全部免费,回复即可查看下载地址!
您需要 登录 才可以下载或查看,没有帐号?立即注册
x
课程介绍:
尚优选是一款HTML、CSS、JavaScript技术综合应用的商城项目,适合初学前端的小伙伴夯实基础,积累项目经验。项目具有很强的实用性,既是对前端基础知识的梳理和整合,同时为后续更多主流技术提供了实际应用的练兵场。
项目技术栈包含:定义HTML页面结构、CSS样式的属性定义,Less中混合器的创建和使用规则、嵌套语法、父级引用等,以及JavaScript中的循环、分支、函数、DOM、BOM、数组、对象等。
项目整体功能的重难点体现在:商品放大镜的功能实现,缩略图的轮播,商品参数数据的动态渲染,以及点击之后的选择结果显示和商品价格的变动效果,公共函数选项卡的创建及灵活调用,网站固定的右侧侧边栏布局和效果等。业务场景贴近实际,技术应用紧跟潮流,完全按照市场需求开发。
课程目录:
01.项目简介
02.登录注册布局搭建
03.列表布局搭建
04.logo以及搜索框
05.商品分类导航布局
06.路径导航布局
07.路径导航数据动态渲染
08.左侧放大镜布局搭建
09.放大镜鼠标移入移出效果
10.放大镜鼠标移动实现蒙版元素的拖拽效果
11.蒙版元素移动的边界控制
12.放大镜移动实现大图元素等比例移动效果
13.放大镜缩略图布局搭建效果
14.放大镜缩略图数据动态渲染
15.点击缩略图实现换小图以及大图效果
16.实现缩略图点击左右箭头的图片轮播效果原理分析
17.计算每一次图片移动的距离以及ul移动的距离
18.右侧商品上半部分详情介绍的布局搭建
19.右侧商品上半部分详情介绍数据动态渲染
20.右侧商品下半部分商品参数布局搭建
21.右侧商品下半部分商品参数数据动态渲染
22.点击第一行商品参数的文字颜色排他效果
23.利用闭包函数来解决循环中事件里面的变量问题
24.实现选择结果的布局搭建
25.点击商品参数实现对应结果的动态添加
26.点击删除按钮实现删除对应参数数据
27.封装价格变动函数
28.购物车以及购买价格的布局搭建
29.中间左侧选项卡整体结构布局搭建
30.中间左侧选项卡具体内容布局搭建
31.中间右侧选择搭配的整体结构布局搭建
32.选择搭配中复选框选中状态的套餐价联动效果
33.中间右侧选项卡布局搭建
34.封装一个公共的选项卡函数并调用
35.右侧导航栏的上半部分搭建
36.右侧导航栏的中间布局搭建
37.右侧导航栏的点击切换状态实现
下载地址:
|
温馨提示:
1、本站所有内容均为互联网收集或网友分享或网络购买,本站不破解、不翻录任何视频!
2、如本帖侵犯到任何版权问题,请立即告知本站,本站将及时予与删除并致以最深的歉意!
3、本站资源仅供本站会员学习参考,不得传播及用于其他用途,学习完后请在24小时内自行删除.
4、本站资源质量虽均经精心审查,但也难保万无一失,若发现资源有问题影响学习请一定及时点此进行问题反馈,我们会第一时间改正!
5、若发现链接失效了请联系管理员,管理员会在2小时内修复
6、如果有任何疑问,请加客服QQ:1300822626 2小时内回复你!