javascript网页设计期末作业 购物网站

本次主要介绍下之前上传的作业的主要功能，网页下载地址：

网页设计期末作业 购物网站

如果对本文章内容还有疑问可以观看视频，也可以在评论区留言：

javascript 网页设计期末作业 购物网站

网页实现的主要功能有：

1.登录及验证 2.轮播图 3.下拉菜单 4.倒计时 5.tab栏 6.固定导航栏 7.留言板 8.购物车(包括商品的添加、删除、结算等) 9.退出登录

(其实大部分功能其实都集中在了主页_(:3」∠)_

首先是登录功能，在未登录状态下从任何网页启动都会跳转到登录页面，默认的登录账号和密码均为123456，有需要的话可以在“登录.html”文件中修改账号密码。

账号密码格式要求至少为6位，对于账号密码为空、少于6位、不正确的情况有三种不同的提示。

登录成功后会自动跳转至主页，这时如果关闭网页重启登录页面则会直接跳转到主页，无需再次登录，退出登录的方法后续会讲。

主页右上角的用户名会根据账号的变化而变化。

接下来讲一讲主页的功能。

首先是下拉菜单，当用户将鼠标移动至顶部菜单栏时，网页会动态显示下拉菜单，且下方会自动为下拉菜单腾出一定的空间。

 然后是精选推荐，单击精选推荐右侧的小图标可以切换大图的显示。

 

鼠标滑过底部的数字可以改变精选推荐的内容

 

 单击右侧的滚动播放按钮可以使推荐内容滚动播放，鼠标滑动至滚动播放的图片上后会自动停止滚动。

网页的特别优惠位置有一个倒计时，由于截止日期已过所以这个数字八成已经是负数了，截止时间可以在“主页.html”文件中修改(注意时间格式)

 

然后是tab栏，单击游戏分类处四个分类标签可以改变下方显示的内容

接下来是右侧的固定导航栏，点击导航栏上的不同标签可以跳转到相应位置。

 单击夜间模式按钮可以将主页颜色在白天模式和夜间模式之间切换(不过只能切换主页的)

 单击固定菜单或者主页顶部的购物车按钮可以切换到购物车页面，不过直接切换的话购物车里是没有东西的，需要先单击主页中的添加到购物车按钮进行添加。

 接下来说一说购物车页面，购物车页面中的总计和合计价格都是动态显示的(当时为了搞这个花了不少心思。。。)，单击数量两侧的加减按钮可以选择购买份数，下方的总计价格会根据购买数量变化。

 下方的删除按钮是可以用的，不过删除后想要再次添加就得重新回到主页，单击确认购买右侧的方框会出现对号，而购物车页面最下方的合计就是所有带对号商品价格的总和，即最终需要支付的价格。

 点击支付按钮网页会跳出付款码，不过这个码其实是百度页面的码，并不能使用。

接下来说一说留言板页面，在主页的精选推荐中第二个推荐里有一个查看详情按钮，单击该按钮可以进入商品的详情页面。

在详情页面下方有一个留言板，在留言框内输入内容后单击右侧的发布留言按钮即可发布留言

发布后的留言会被保存在电脑后台，即使刷新页面也不会消失，不过可以单击留言右侧的删除按钮进行删除。

最后还有一个用来凑数的个人中心页面，单击主页右上角的用户名可以1跳转至个人中心页面，单击该页面中的退出登录按钮就可以退出登录并跳转回登录页面。

以上就是该网页的全部内容，祝大家期末不挂科(ง •̀_•́)ง