花花最美腻-优快云博客

原创类似天猫侧边导航栏

/*垂直导航栏开始*///index()方法获得第一个匹配元素相对于其同级元素的index位置所有兄弟节点中的索引var arr = ["1460", "2150", "2935", "3620", "4330", "5020", "5725", "6423", "0"];//把元素到页面顶部的高写死在数组里不太科学但也

2018-06-02 16:38:57 1291

参考https://www.cnblogs.com/stoneniqiu/p/5538109.htmlhttps://blog.youkuaiyun.com/Szu_AKer/article/details/84928570https://github.com/SFantasy/express-load-router一、初始路由// 入口文件app.jsvar usersRouter = require('./routes/users');app.use('/users', usersRou.

2020-06-03 16:05:40 663

转载转载-charles的使用

夏天的吃瓜群众 https://www.jianshu.com/p/fb2bdde5b498一、charles的使用1.1 charles的说明Charles其实是一款代理服务器，通过过将自己设置成系统（电脑或者浏览器）的网络访问代理服务器，然后截取请求和请求结果达到分析抓包的目的。该软件是用Java写的，能够在Windows，Mac，Linux上使用。安装Charles的时候要先装...

2019-01-08 17:23:02 403

原创 css实现自定义复选框-HTML特殊字符实现

主要使用HTML特殊字符实现（豆友贡献 https://www.douban.com/group/topic/28046629/），但是有兼容性问题，改进三次。图一交互图图二使用9744/9745，展示效果不错，使用css最少，但是vivo某一手机兼容性问题严重，显示错误（是个❌？？？，不晓得为什么）。图二使用2713，完全不可取的写法，样式哪里有问题改哪里，导致各个...

2019-01-04 19:24:13 1428

转载转载-vue.js动态绑定class

原文：http：//www.cnblogs.com/big-snow/p/5718728.html 补充：class="con" :class="{testClass : test} 这种写法是支持的，完全可以解决一个class是固定，一个class是动态的问题。数据绑定vue指令以 v- 前缀标标，数据绑定的指令 v-bind：属性名，简写为：属性名，简单...

2018-11-15 14:29:02 1235

原创凹凸曼但没有小怪兽 CSS的世界

需求：使用一层HTML标签实现如下效果效果图套路图这是从“ CSS的世界 ”中学来的（P23），大神就是大神，熟练掌握着css各种属性的特性。以下是代码： <span class="ao"></span><span class="tu"></span>.ao,.tu { display: inli...

2018-10-16 20:30:30 317

原创不知道具体属性时，输出对象属性的值

1、Object.keys(obj) var obj={ name:'huahua', age:18 }; Object.keys(obj).forEach(function (key,idx) { if(idx==1){ console.log(obj[key]);//18 } ...

2018-08-21 23:34:35 955

原创微信小程序获取系统时间-利用系统自带util.js

自动获取系统时间如图，创建小程序项目之后会自动生成utils文件夹，获取时间的函数就在util.js中。1、声明函数打开文件。矩形框中是原来代码，返回年月日时分秒。我需要分开，就自己复制修改了两个函数formatTime1（返回年月日），formatTime2（返回时分秒），你可以根据自己需求修改。最重要，要暴露出去2、调用js文件（console可以不写）...

2018-08-10 16:19:15 14589 6

转载转载-three.js下载与开发指南

原文网址three.js - 一个javascript 3D代码库这个项目的目的是用最简单的开发模式创建一个轻量级的3 d代码库，这个js库提供了canvas，svg，css3d和webgl这四种渲染方式。下载地址：下载地址：https：//github.com/mrdoob/three.js/archive/master.zip 或者打开threejs.o...

2018-08-08 09:50:42 9794

转载转载-微信小程序下拉框

原文网址图片去icon网站下载就好了微信小程序里没有和HTML里的下拉框一样的组件，想要相同的效果只能自己写一个，先看效果下面来看一下代码：首先WXML<view class='select_box'> <view class='select' catchtap='selectTap'> <text class='se...

2018-08-05 00:06:24 1616 1

转载转载-小程序内部链接跳转

原文网址一.bindtap="onProductsItemTap"绑定点击跳转事件在.wxml文件中绑定在.js文件中实现绑定事件函数二.navigator标签配合URL跳转法在wxml的代码目标跳转页面的js文件 ...

2018-08-04 22:22:05 8617 1

原创 sass 安装使用 webstrom参数配置

ruby和sass网盘第一步、根据自己电脑安装对应版本ruby，推荐默认路径（路径不要有中文）找到自己ruby路径，如下图输入语句 gem install sass（直接从网上下载）也可以输入gem install sass的路径（拖拽进来就行）第二步、配置webstrom参数（图丑，将就）file => setting（不是default settin...

2018-07-26 19:05:04 462

转载转载-css 属性clip-path之多边形polygon小窥

原文http://www.cnblogs.com/leegao/p/4384499.html

2018-06-30 11:59:39 6242

原创 GitHub绑定

1、绑定自己的GitHub账号（前提你已经注册过Git账号）。如图填写自己的账户密码，并填写下载的Git的存储路径。2、clone别人的Git（需要知道比人Git地址）。如图填写地址，并选择一个存储路径。...

2018-06-25 18:34:33 2088

原创微信小程序ID申请

开发者工具下载https://mp.weixin.qq.com/debug/wxadoc/dev/devtools/download.html?t=2017142017.1.4版本然后登录微信公众平台 https//:mp.weixin.qq.com1、注册账号，选择小程序（也可以从服务号注册，前提你有一个服务号）注册后登录，登录时微信扫码验证一下2、填写小程序信息，注意服务类目，有的特殊行业需要...

2018-06-24 15:51:43 30365

转载转载-css中关于transform、transition、animate的区别

会飞的鱼儿游css中关于transform、transition、animate的区别写动画经常会用到这几个属性，他们之间有什么区别呢？1.transform　　每每演示transform属性的，看起来好像都是带动画。这使得小部分直觉化思维的人（包括我）认为transform属性是动画属性。而恰恰相反，transform属性是静态属性。它其实只是一个静态属性，需要配合transition和anim...

2018-06-24 10:17:09 485

原创 css3照片特效阴影（曲线投影和翘边投影）

主要语法1、实现阴影box-shadow: h-shadow v-shadow blur spread color inset参数： h-shadow (必需)：水平阴影的位置。允许负值。 v-shadow (必需)：垂直阴影的位置。允许负值。 blur (可选)：模糊程度，值越大越模糊。 spread (可选)：阴影的尺寸。 color (可选)：阴影的颜色。请参阅...

2018-06-11 16:21:55 3966

原创 clone对象（key/in和JSON两种方法）

对象、数组都是用堆存储，存储数据在一个堆内存地址中。如果用var person2=person1；当改变person1或person2下的属性、方法等值时，会改变地址中的值，所以原对象的值也会改变。所以如果有一个对象1，想复制一个对象2和对象1一样，要采用clone方法。1、JSON 使用JSON下的两个方法var str=JSON.stringify(per);/*对象转字符串*/var...

2018-06-11 09:54:34 1515

原创 css3动画导航栏3D

源码网盘根据慕课网做的css3小特效导航栏，图标以不同方式显示页面布局<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <link rel

2018-06-10 11:48:24 1328

转载转载-CSS中强大的EM

W3CPLUS转载使用CSS也好久了，但一直都是在使用“px”来设置Web元素的相关属性，未敢使用“em”。主要原因是，对其并不什么了解，只知道一点概念性的东西，前段时间在项目中要求使用“em”作为单位设置元素，所以从头对“em”学习了一回。稍为有一点理解，今天特意整理了一份博文与大家一起分享，希望对童子们有些许的帮助。这篇教程将引导大家如何使用“em”来创建一个基本的弹性布局，从而学习其如何计算...

2018-06-10 11:48:13 215

原创历史记录（hash和history两种）

1、hash利用网页地址后的hash值不同，来区分记录不同页面内容http://localhost:63342/verbose-octo-parakeet/html5/%E5%BD%A9%E7%A5%A8.html?_ijt=sejs0urr6t2dve9uj19gd0jh1i#0.2692206212424262（hash值）<!DOCTYPE html><html lang...

2018-06-09 21:05:49 2667

转载转载-Python图像处理之图片文字识别（OCR）

点击打开链接 segmentFault_jclian91_Python图像处理之图片文字识别（OCR）OCR与Tesseract介绍将图片翻译成文字一般被称为光学文字识别（Optical Character Recognition，OCR）。可以实现OCR 的底层库并不多，目前很多库都是使用共同的几个底层OCR 库，或者是在上面进行定制。 Tesseract 是一个OCR 库，目前由Go...

2018-06-09 11:07:25 3434

转载 CSS3中常用字体图标库总结

[一勺烩]CSS3中常用字体图标库总结 - 靳洪飞的文章 - 知乎https://zhuanlan.zhihu.com/p/21910270字体图标以前网页上显示图标都是用切成小图片，然后根据不同场景作多个小图，通过JS来控制显示效果。字图图标，顾名思义，就像使用通常的字体，可以设置字体颜色，大小等，不用在搞多张小图片，非常灵活。优点轻松的定义图标的颜色，大小，阴影，和任何与CSS相关的特性。更...

2018-06-08 21:41:13 9580

原创旋转合并照片墙-特效照片墙

思路：首先预加载照片，分大图小图两个循环预加载函数，共48张图片，count记录循环次数，count==48时执行loadSuccess()中代码。先让照片显示在div中，然后定位隐藏在左上角，然后计算每张图片应该在的位置，设置其left和top。使用transition语法让他们动态显示，并且设置不同的延迟时间TransitionDelay让他们一张一张显示，并且有一个随机角度（...

2018-06-08 21:00:26 2926

原创 JavaScript小火箭置顶功能

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>fire</title> <style> * { margin: 0;

2018-06-07 18:24:11 1176

原创 JavaScript生成右键菜单

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>右键菜单</title> <style> * { margin: 0;

2018-06-07 18:23:58 254

转载 AMD 和 CMD 的区别有哪些？（玉伯）

AMD 和 CMD 的区别有哪些？作者：玉伯链接：https://www.zhihu.com/question/20351507/answer/14859415来源：知乎AMD 规范在这里：https://github.com/amdjs/amdjs-api/wiki/AMDCMD 规范在这里：https://github.com/seajs/seajs/issues/242AMD 是 Requi...

2018-06-06 16:37:08 34807

原创元素水平垂直居中（css/css3）

一、css实现1、margin<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title></title> <style> *{ m

2018-06-06 16:10:57 178

原创 css和css3弹性盒模型实现元素宽度（高度）自适应

一、css实现左侧宽度固定右侧宽度自适应1、定位<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>自适应</title> <style> *{

2018-06-06 16:01:59 9597

原创前端基础测试题

简答1、行级元素块级元素区别块级元素：能设置宽高，自己一行 display: block行级元素：不能设置宽高，很多一行宽度由内容撑的 display: inline行级块元素：水平分布可以设置宽高 display: inline-block行内元素有：meat title lable span br a style em b i strong块级元素有：bod...

2018-06-06 15:47:54 3948

原创 css写箭头

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title></title> <style> div{ width: 0;/*元素宽

2018-06-06 15:27:40 455

原创 js无缝滚动原理

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title></title> <style> * { margin: 0;

2018-06-03 16:46:27 1228

原创 js版放大镜

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>放大镜</title> <style> *{ padding: 0;

2018-06-03 16:24:36 711

原创图片放大镜 jQuery插件

插件网盘地址用户传参/*使用jqzoom*/$(function(){ $('.jqzoom').jqzoom({ zoomType: 'standard',/*遮罩层样式*/ lens:true,/*鼠标滑入显示遮罩层*/ preloadImages: false,/*预加载*/ alwaysOn:false,/*初始是否显示遮罩层*/ zoomWidth: 340,/*放...

2018-06-03 15:24:38 956

原创旋转的立方体 css3

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title></title> <style> * { margin: 0;

2018-06-03 14:56:06 187

原创钟表例子（css3/画布）

神奇的canvas<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title></title> <style> *{ m

2018-06-03 11:46:12 375

原创 css3例子奥运五环

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title></title> <style> *{ margin: 0;

2018-06-02 12:52:52 1244

原创滑动到底部固定侧边栏

J_BdSide是滑动侧边栏id选择器<script> $(window).scroll(function() { var windowHeight = $(window).scrollTop() + $(window).height(); //获取滚动条滚动距离+窗口高度 var sideHeight = $('#J_BdSide').height(); /...

2018-06-02 10:26:00 914

原创响应式菜单

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> &lt

2018-06-01 21:27:09 1154

原创网站换肤

效果图可选框是一张背景图片，通过定位显示不同颜色和对号1、jsvar color=["#9e9e9e",'#b2d600','#f8b646','#08bece','#e3165c','#bb3bd9'];//把颜色按顺序存在数组里$('#skin-ul li').on('click',function () { //点击li时给当前li添加class（‘’active‘’）兄弟移除c...

2018-06-01 20:46:30 636

空空如也

空空如也