demo
hr226
这个作者很懒,什么都没留下…
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
全图滚动demo
三种方式实现全图滚动: 1、css 2、jQuery 3、SmoothScroll插件 三种方式实现全图滚动.html 文件 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=d...原创 2019-09-10 11:45:59 · 139 阅读 · 0 评论 -
Gulp 压缩图片demo
1、拷贝文件 2、压缩图片 3、压缩js代码 gulpfile.js 在终端中执行命令:gulp 任务名 即可完成上面1、2、3(前提:在项目内安装好相关的插件) // 处理任务 // 在全局安装和在项目内安装了gulp后,引入gulp模块 var gulp = require("gulp"); // 在项目内安装了gulp-imagemin模块后引入该模块 var imagemin = requ...原创 2019-09-12 22:23:59 · 546 阅读 · 0 评论 -
Gulp 代码合并demo
1、Sass转换 2、执行多任务 3、代码合并 4、监听文件 gulpfile.js // 处理任务 // 在全局安装和在项目内安装了gulp后,引入gulp模块 var gulp = require("gulp"); // 在项目内安装了gulp-imagemin模块后引入该模块 var imagemin = require("gulp-imagemin"); // 压缩js文件,需要引入的ug...原创 2019-09-13 13:15:35 · 258 阅读 · 0 评论 -
webpack初识体验demo
1、npm init 2、npm install -g webpack 3、npm install webpack --save-dev 4、npm install -g webpack-cli 5、npm install webpack-cli --save-dev 6、webpack app.js -o bundle.js 7、webpack app.js -o bundle.js --wat...原创 2019-09-13 14:32:32 · 225 阅读 · 0 评论 -
webpack 运用第三方库&搭建服务器demo
1、使用第三方(JQuery) 2、模块化静态文件(CSS) 3、使用配置文件webpack.config.js 4、使用webpack-dev-server 5、使用babel转换插件 1、npm install jquery --save-dev 2、npm install css-loader style-loader --save-dev 3、webpack 4、npm install -...原创 2019-09-13 16:38:07 · 154 阅读 · 0 评论 -
Vue简单用户管理源码
一、Vue—安装脚手架 1、npm install -g vue-cli //全局安装脚手架 2、vue init webpack my-project //创建一个基于webpack模板的新项目(项目名my-project) 二、Vue—基础语法 <template> <div> <!-- 获取数据 --> <h1>{{ti...原创 2019-09-13 18:33:40 · 548 阅读 · 0 评论 -
Vue2.x在线翻译实战项目源码
index.html <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>online</title> <link rel="stylesheet" href="https://bootswatch.com/4/flatly/bo...原创 2019-09-14 15:46:03 · 303 阅读 · 0 评论 -
vue购物车项目demo
vue@2.6 vue-router@3.0 vuex@3.0 vue-cli@3.x axios@0.19 element-ui2.9 https://www.jianshu.com/p/fab89c48268c 1、npm install -g @vue/cli 2、vue create hello-vue 3、npm install element-ui axios --save 项目源码:...原创 2019-09-15 20:25:12 · 463 阅读 · 0 评论 -
初识ChartJS(前端第三方库)demo
index.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta htt...原创 2019-09-12 11:15:14 · 629 阅读 · 0 评论 -
Ajax请求本地数据库demo
ajax5.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Ajax 5 - 请求PHP数据</title> </head> <body> <button id="bu...原创 2019-09-12 10:43:02 · 829 阅读 · 0 评论 -
Promise对象demo
index.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http...原创 2019-09-10 16:57:51 · 136 阅读 · 0 评论 -
使用css变量存储demo
index.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta htt...原创 2019-09-10 18:13:53 · 198 阅读 · 0 评论 -
弹窗demo
index.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http...原创 2019-09-10 17:33:20 · 328 阅读 · 0 评论 -
使用html+css+js实现页面分割效果demo
index.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta htt...原创 2019-09-10 18:57:55 · 1314 阅读 · 0 评论 -
图片切换demo
index.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta htt...原创 2019-09-10 21:32:57 · 187 阅读 · 0 评论 -
移动端表单网页制作demo
index.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta htt...原创 2019-09-11 17:22:20 · 2229 阅读 · 0 评论 -
Ajax请求的两种方式demo
Ajax请求的两种方式 onload VS onreadystatechange ajax1.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-wid...原创 2019-09-11 21:38:21 · 659 阅读 · 0 评论 -
Ajax请求json数据demo
ajax2.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Ajax 2 - 请求JSON数据</title> </head> <body> <button id="b...原创 2019-09-11 22:03:56 · 340 阅读 · 0 评论 -
Ajax请求GitHub真实api接口demo
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>请求GitHub真实api接口</title> <style> .user { display: flex; ...原创 2019-09-11 22:18:38 · 424 阅读 · 0 评论 -
Ajax请求PHP接口&传递数据到数据库demo
ajax4.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Ajax 4 - 请求PHP接口</title> </head> <body> <button id="bu...原创 2019-09-11 22:52:39 · 831 阅读 · 0 评论 -
vue 5个demo
<!-- 案例一 --> <!-- <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> ...原创 2019-10-03 15:21:19 · 246 阅读 · 0 评论
分享