爱淘宝手机触摸屏端web应用开发.pdfVIP

爱淘宝手机触摸屏端web应用开发 一、项目目标 1. 掌握工程项目的整体开发流程； 2. 理解并应用BS结构开发的层次； 3. 熟练掌握JavaEE技术规范和项目开发； 4. 常用开发工具(PowerDesigner Eclipse SqLyog)的使用; 5. 数据Mysql 的建模和操作使用； 6. 代码编写能力和开发规范； 二、项目介绍 爱淘宝是阿里巴巴旗下购物分享综合型网站，通过海量淘宝基础数据和第三方达人， 为消费者精选淘宝天猫的商品。爱淘宝汇集众多资深黄钻买家 时尚达人 红人模特来解读 最新潮流趋势，在爱淘宝中可以分享真实可信的购物经验和穿搭技巧，帮助消费者发现潮流 的淘宝商品和店铺，获取各类热点购物资讯。 在爱淘宝中可以加入达人，一起分享购物乐 趣。 1. 项目截图 2. 项目包含技术 1. 前端技术：HTML5 CSS3 BootStrap 2. 客户端脚本技术：JavaScript Jquery Ajax 3. 服务端技术：Servlet JSP JDBC Dbutil C3P0 4.Java高级技术：java 反射 3. 项目开发环境  JDK7 以上版本  Tomcat 以上版本，支持Servlet3.0注解功能  MySQL5.0数据库 4. 项目开发工具  Eclipse  SQLyog  PowerDesigner建模工具 三、项目描述 1. 开发流程 2. 需求描述  针对不同手机终端实现页面的自响应式 登录页面必须做到地址过滤和 的回调  url  实现不同的商品参数显示的灵活规划 首页利用 实现推荐图片的轮播效果  JS  商品列表页面根据不同的商品分类完成显示 商品列表右侧有列表分类的 效果操作  JS  具体进入详细商品必须完成商品图片，商品参数，商品描述，商品同店推荐操作  实现商品购物功能，要求：必须根据不同商品参数动态加载商品的颜色 尺寸等参数信/ 息 3. 功能模块 4. 数据库设计 5. 核心技术 BootStrap 1) BootStrap框架  安装bootstrap插件。bootstrap 中css,fonts,js拷贝到WebContent  在一个网页中引入bootstrap相关的文件  设置移动设备优先的元数据meta name=”viewport” ...  引入bootstrap 的css文件  引入jQuery的js文件，务必在引入bootstrap 的js文件之前先写好  引入bootstrap 的js文件 meta name=viewport content=width=device-width, initial-scale=1.0 link rel=stylesheet type=text/css href=bootstrap/css/bootstrap.css link rel=stylesheet type=text/css href=bootstrap/css/carousel.css link rel=stylesheet type=text/css href=css/flat-ui.css script src=/jquery/1.11.2/jquery.min.js/script script src=/bootstrap/3.3.4/js/bootstrap.min.js/script 2) BootStrap 中的格栅布局  利用栅格布局能够基本做到不同手机终端的自适应 基本原则：将浏览器划分为 个网格  12  12个网格布局图 例子将屏幕分为 个区域，如何使用 中栅格布局 : 2 bootstrap body div class=container