
js-案例
文章平均质量分 70
kaiking_g
永远不要把钱看作财富,真正的财富是占据生存资料实现永久不劳而获,不要把赚钱看成了最终目标,你嘲笑按揭买房的人是房奴,事实却是富人都在负债买资产,穷人越存钱越穷!
展开
-
案例-html2canvas
效果图:源码:<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <title>html2canvas</title> <script src="http://html2canvas.hertzen.com/dist/html2canvas.min.js"></script> <style> <原创 2022-04-20 16:02:41 · 713 阅读 · 0 评论 -
html页面添加水印
效果图### 源码<!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, maximum-sc转载 2021-12-30 11:47:29 · 2823 阅读 · 0 评论 -
vue 项目实战过程中,遇到的问题与解决方法
vue,涉及到三层关系组件嵌套(父子孙),孙子级组件首次无法加载数据问题解决 方法:把赋值方法写在this.$nextTick 里面即可比如:this.$nextTick(() => { this.form.data.classTypeId = this.editClassData.classTypeId})...原创 2019-01-25 15:15:07 · 1725 阅读 · 0 评论 -
js 广告文字跑马灯特效
直接看源码 <!doctype html><html><head> <meta charset="UTF-8"> <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-原创 2018-10-12 14:34:59 · 3167 阅读 · 0 评论 -
案例-小球自由落体运动
源码: 32.拖拽,自由落体运动 #box{ position:absolute;top:0; left:0; width:60px;height:60px; cursor:pointer; border-radius:50%; background:blue; } var box = document.getElementB原创 2017-12-04 23:57:43 · 3041 阅读 · 1 评论 -
案例-多个小球碰撞
div{ position: absolute; top:10px;left:0; width:50px; height:50px; border-radius:50%; background:-webkit-linear-gradient(top, red, rgba(0, 0, 255, 0.5)); background:linear-gradient(top, r原创 2017-11-12 17:39:59 · 3317 阅读 · 0 评论 -
案例-canvas绘制雨滴
思路晚点在整理<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>canvas雨滴</title> <style> body,html{padding:0;margin:0px;height:100%;...原创 2017-06-10 15:24:24 · 2285 阅读 · 0 评论 -
案例-js-模块化创建dom与字符串创建dom的耗时比较(性能优化)
模块化创建dom与字符串创建dom的耗时比较模板创建:主要是正则表达式匹配,替换数据字符串创建:字符串,替换数据一共两个文件,index.html ,list.txt看截图:index.html 源码 模块与模板创建的耗时比较 *{margin原创 2017-06-21 14:42:36 · 726 阅读 · 0 评论 -
案例-懒加载-web-javascript学习
懒加载 body,html{width:100%;margin:0;padding:0;} #box{width:100%;} #box ul{width:840px;padding:0px;margin:0 auto;overflow:hidden;} #box ul li{float:left;list-style: none;width:190px;background:原创 2017-06-10 12:50:56 · 910 阅读 · 0 评论 -
案例-重力的弹弹球
仅一个文件直接看源码: 重力的弹弹球 #login{position:absolute;left:100px;top:0px;width:100px;height:100px;background:blue;border-radius:50%;cursor:pointer;box-shadow:0px 0px 22px #000;} wind原创 2017-06-28 23:19:27 · 553 阅读 · 0 评论