- 博客(60)
- 资源 (5)
- 收藏
- 关注
RSS订阅原创 git仓库基本使用
git仓库的一些基本使用1.克隆git项目git clone git@github.com:自己用户名/项目名称.git2.查看状态gut status3.将文件添加到暂存区添加指定目录到暂存区，包括子目录：git add [dir]添加当前目录下的所有文件到暂存区：git add .4.将暂存区内容添加到本地仓库中提交暂存区到本地仓库中:git commit -m '内容'5.分支5.1创建分支git branch mybranch（分支名字）5.2.查看分支
2021-05-12 22:30:04
165
原创 原生JSbanner图实现滑动轮播图和淡入淡出轮播图
滑动轮播图<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Docu
2021-03-30 22:23:12
305
原创 Vue----------学习用vuex中的state、mutations和getters实现一些功能
store中的index.jsimport Vue from 'vue'import Vuex from 'vuex'Vue.use(Vuex)export default new Vuex.Store({ state: { counter: 1000, students: [{ id: 110, name: 'why', age: 18 }, { id: 111, nam
2021-03-11 20:48:02
104
原创 Vue------用vuecli做一个底部菜单栏的实现
App.vue<template> <div id="app"> <router-view></router-view> <main-tab-bar></main-tab-bar> </div></template><script>import MainTabBar from "./components/mainTabBar/MainTabBar";export de
2021-03-08 20:02:29
379
1
原创 Vue------学习 组件之间的通信 父传子 结合一个计数器的实现
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body> <div id="app"> <cpn :mycounter="counter"></cpn> <div> <h2&g
2021-02-19 13:28:55
137
原创 Vue学习------ 写一个简单的图书购物车
CSStable { border: 1px solid #e9e9e9; border-collapse: collapse; border-spacing: 0; } th, td { padding: 8px 16px; border: 1px solid #e9e9e9; text-align: left; } th { background-color: #00eeee; color: #5c6b77;
2021-02-18 16:08:14
261
原创 Vue学习------用v-bind和 v-for实现点击元素让它变为红色 和计算属性的使用
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><style> .color{ color: red; }</style><div id="app"> <ul> <!--&
2021-02-09 13:49:50
311
1
原创 Vue学习------v-for 列表的使用 和 v-on 点击加减数字
v-for 列表的使用<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><div id="app"> <ul> <li v-for="item in shuzu">{{item}}<
2021-02-04 19:00:45
500
原创 用 gulp require.js 和 jQuery 写一个小米项目之-----滚动商品和下面商品加载的实现
滚动商品slide.js//滚动商品的函数define(["jquery"],function($){ function download(){ $.ajax({ url:"../data/slide.json", success:function(res){ //获取数据 var slideArr = res.data.list.list;
2020-12-14 21:19:34
1191
原创 用 gulp require.js 和 jQuery 写一个小米项目之-----顶部导航栏的实现
nav.js（main.js自己在去配置一下就行了 这里就不放出来了只是多了一个顶部导航的函数）//处理首页的导航部分 声明模块也遵循amddefine(["jquery"],function(){ function download(){ //数据下载 $.ajax({ type:"get", url:"../data/nav.json", success:function(result){
2020-12-10 21:42:41
300
原创 用 gulp require.js 和 jQuery 写一个小米项目之-----轮播图和左侧导航栏的实现
gulofile.js中的配置/* 把 .scss文件 => csswenjian =>压缩 => min.css*/ const gulp = require("gulp");const scss = require("gulp-sass");const minifyCSS = require("gulp-minify-css");const rename = require("gulp-rename");gulp.task("scss",function(){
2020-12-06 23:13:39
9402
原创 用jQuery 做出放大镜的效果
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style>
2020-09-24 22:18:00
244
原创 用jQuery实现 鼠标拖拽div滑块 选项卡 居中弹窗
鼠标拖拽div滑块<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style&
2020-09-20 22:36:03
302
原创 用ajax +bootstrap实现前后端交互之 注册，登录，查询数据，修改和删除数据（css自行下载）
1.1 注册页面 register.html<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <title>注册</title> <link rel="stylesheet" href="../css/bootstrap.min.css"> <style> #register{width: 400px; marg
2020-09-07 16:18:36
2917
8
原创 bootstrap + ajax +php 实现 前后端的交互之查询表数据和插入数据
查询数据的php页面<?php header('content-type:text/html;charset="utf-8"'); /* 连接数据库 天龙八部 */ /* //1.连接数据库 第一个参数：连接数据库IP 第二个参数：用户名 第三个参数：密码*/ $link = mysql_connect("localhost","root","root");
2020-09-05 17:09:17
700
原创 用ajax实现post和get提交 实现前后端交互
封装ajax_回调函数.html 页面<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <script>
2020-09-05 17:02:00
332
原创 用JS实现多个图片的放大和缩小
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> *{margin: 0px;
2020-09-04 14:59:15
876
1
原创 用js实现banner图效果
函数startMove的实现function startMove(node, cssObj, complete){//complete = show; clearInterval(node.timer); node.timer = setInterval(function(){ var isEnd = true; //假设所有的动画都到达目的值。 for(var attr in cssObj){ var iTarget = cssO
2020-09-03 14:43:57
1620
原创 用JS实现圆周运动
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style>
2020-08-30 17:17:11
987
原创 用原生js编写一个简单的打砖块游戏
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> *{margin: 0;paddin
2020-08-30 17:00:28
395
原创 web前端之js实现链式运动
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> div{width: 100px;
2020-08-30 13:12:36
178
原创 web前端多物体多运动
多物体多运动的一个样式<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> div{w
2020-08-29 14:48:00
212
原创 缓冲菜单（滑块根据滚轮滑动一直滑动到页面右边的中间）
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> #menu{width: 100px
2020-08-29 14:45:34
204
原创 用事件委托 实现点击li会把背景变红
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"/> <meta name="viewport" content="width=device-width, initial-scale=1.0"/> <meta http-equiv="X-UA-Compatible" content="ie=edge"/>
2020-08-27 15:59:26
723
原创 div滑块的缓冲运动
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> #div1{width: 100px
2020-08-27 15:40:40
236
原创 鼠标移入分享 菜单移出来 鼠标移出 菜单回去
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> *{margin: 0px; pad
2020-08-27 14:20:27
144
原创 正则表达式判断简单的表单验证
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> #div1{width: 250px
2020-08-24 15:03:46
202
原创 类似购物车的放大镜效果
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> *{margin: 0;paddin
2020-08-23 15:40:57
224
原创 鼠标拖拽div快在页面上移动
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> *{margin:0;paddin
2020-08-22 14:56:06
153
原创 跟随鼠标一串的效果
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> div{width:10px;hei
2020-08-22 14:18:24
189
原创 鼠标移入div 让div跟着鼠标移动
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> *{ mar
2020-08-19 16:48:48
249
原创 添加文本内容到下面并且可以删除和复制
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> #div1{width: 400px
2020-08-18 14:58:51
205
原创 一秒修改一次div内文本颜色和文字大小，当增大了6次以后, 文字大小开始缩小,缩小6次,文字再开始增大。
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> #a{width:300px;he
2020-08-18 13:30:07
486
原创 用JavaScript实现秒表的开始暂停和复位
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> #div1{width: 100px
2020-08-17 10:49:27
776
转载 用bootstrap框架做一个简单粗糙的博客
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <link rel="stylesheet" href="css/boot
2020-08-11 17:15:21
252
原创 用grid组成 骰子 并且让骰子旋转
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> *{margin: 0;paddin
2020-08-09 16:35:05
190
原创 上下左固定 中间内容自适应（用BFC实现）
/*原理：利用BFC中的overflow：auto来实现中间内容自适应头部 左面和 底部都设置好宽高 中间用四则运算calc计算内容的高度 宽度不用设置使用overfl：auto自适应就可实现。*/<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, ini
2020-08-07 17:58:05
188
原创 正达管理后台首页的粗糙实现（练习）
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <link rel="stylesheet" href="./iconfo
2020-08-06 20:51:36
399
原创 博文尚美页面的粗糙展现（练习）
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> *{margin: 0;padding: 0
2020-08-05 16:08:04
356
web前端-----10种图片hover效果.zip
2020-07-18
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人