2018年03月_dongsdh

12月 11月 10月 09月 08月 07月 06月 05月 04月 03月

原创轮播的图片，不是等高等宽，解决办法

前言：常见的轮播都是等宽等高，之前遇到一个需求，需要轮播的图片，不是等高等宽，当时没有思路。是去获取下一张需要轮播图片的width和height,放进来的时候，把它上下左右居中，，，总而言之，费劲。看了一下别人做的，采用下标的方式，动态显示下一张，居中时不用管宽高了缺点是图片较小时，会留白。...

2018-03-30 10:48:28 2551

原创列表式单选在切换选中项时会触发selected事件

列表式单选在切换选中项时会触发selected事件，在事件参数（e.detail.el）中可以获得当前选中的dom节点，如下代码打印当前选中项的innerHTML：<body><ul class="mui-table-view mui-table-view-radio"> <li class="mui-table-view-cell"> <a cl...

2018-03-30 10:34:11 1364

原创 mui-折叠面板

<!doctype html><html> <head> <meta charset="UTF-8"> <title></title> <meta name="viewport" content="width=device-width,initial-scale

2018-03-30 10:32:54 1740

原创 mui-提示

mui.confirm("你点击了","我想给你个提示",["确认","取消","sfsf"],function(e){ if(e.index==0){ console.log("确定"); } if(e.index==1){ console.log("确定sss"); } if(e.i

2018-03-30 10:31:37 711

原创重复运动（左>右，左>右）

wxml<view> <view> <image style="width:32rpx; height:32rpx;background:red;" animation="{{animationMiddleHeaderItem}}"></image> </view> &lt

2018-03-30 10:18:28 199

原创往返运动（左>右>左>右）

wxml<view> <view> <image style="width:32rpx; height:32rpx;background:red;" animation="{{animationMiddleHeaderItem}}"></image> </view> &lt

2018-03-30 10:17:29 382

原创小程序-获取系统信息

onLoad: function () { console.log('onLoad') var that = this // 获取系统信息 wx.getSystemInfo({ success: function (res) { console.log(res); // 可使用窗口宽度、高度 console...

2018-03-30 10:15:41 436

原创小程序-节点选择器

gettextHeight:function(){ var h="";////创建节点选择器 var query = wx.createSelectorQuery();// //选择id query.select('#showtext').boundingClientRect() query.exec(function (res) {// //res就是所有标签为m...

2018-03-30 10:15:01 9889 1

原创小程序动画-循环放大缩小的动画（一闪一闪的）

var circleCount = 0; // 心跳的外框动画 this.animationMiddleHeaderItem = wx.createAnimation({ duration:1000, // 以毫秒为单位 timingFunction: 'linear', delay: 100, ...

2018-03-30 10:13:20 14959 2

原创拖拽（获得位置可保存）

<html><head runat="server"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Index</title> <script type="

2018-03-26 17:17:59 2145

^((0?1[358]\d{9})|((0(10|2[1-3]|[3-9]\d{2}))?[1-9]\d{6,7}))$ 手机及座机区号+座机号码+分机号码：regexp="^(0[0-9]{2,3}\-)?([2-9][0-9]{6,7})+(\-[0-9]{1,4})?$"手机(中国移动手机号码)：regexp="^((\d3\d3)|(\d{3}\-))?13[456789]\d{8}...

2018-03-20 10:28:43 275

转载 input 绑定回车事件

html<input type="text" id="message" onkeypress="return onKeyPress(event)" > script function onKeyPress(e) { var keyCode = null; if(e.which) keyCode = e.which; else if(e.keyCode) ke...

2018-03-20 10:17:44 11430

转载 js只保留整数，向上取整，四舍五入，向下取整等函数

1.丢弃小数部分,保留整数部分parseInt(5/2)2.向上取整,有小数就整数部分加1Math.ceil(5/2)3,四舍五入.Math.round(5/2)4,向下取整Math.floor(5/2)Math 对象的方法方法描述abs(x)返回数的绝对值acos(x)返回数的反余弦值asin(x)返回数的反正弦值atan(x)以介于 -PI/2 与 PI/2 弧度之间的数值来返回 x 的反正切...

2018-03-20 09:54:25 192

转载动态加载、移除js/css文件

前言：找了个轮子本文简单介绍动态加载、移除、替换js/css文件。有时候我们在写前端的时候，会有出现需要动态加载一些东如css js 这样能减轻用户加载负担，从而提高响应效率。下面贴出代码。 <script language="JavaScript">//动态加载一个js/css文件function loadjscssfile(filename, filetype){if (file...

2018-03-20 09:49:22 6030

原创判断两个数组是否全等

var arr1 = [1, 2, 3]; var arr2 = [1, 2, 3]; function arrayEqual(arr1, arr2) { if(arr1 === arr2) return true; if(arr1.length != arr2.length) return false; for(var i = 0; i < arr1.length; +...

2018-03-19 15:46:05 2887

原创通栏形式的划出栏显示（使用于导航菜单）

前言：用下标找导航栏对应的div,让其显示出来html <ul> <li></li> <li></li> <li></li> </ul> <header> <div> <p>1&

2018-03-19 15:45:37 786

原创移动端开发模板

<!DOCTYPE html><html lang="en"><head> <meta charset="utf-8" /> <meta name="viewport" id="viewport" content="width=device-width, initial-s

2018-03-19 15:43:42 371

原创 boder各种样式

2018-03-19 15:43:28 732

原创网页真实宽度

2018-03-19 15:43:18 222

原创温故而知新

为什么开博客？以前看到有趣的前端技术知识喜欢存在微信收藏和QQ收藏中。久了要再用的时候也不是很方便找到。所以在这里再次整理及归类，方便以后的调阅查看。文中所发内容再次经过实测，还是看到一些不足之处1,没有看到一些方法的局限性，没有注意到一些方法在特定场合才起作用。2,整理归类，希望在这一行工作的朋友路过时提一些意见和建议，一起成长进步。3,微信收藏和QQ收藏以后，合并到这里，作为知识点的再次巩固。...

2018-03-19 15:43:00 132

原创 canvas基础动画-循环从屏幕下方出现-上方消失（可切换速度，字号，单色，彩色，显示用户输入内容）

前言：这个本来想用小程序的wxcanvas写的，但是发现，微信里的wxcanvas层级最高，不能用z-index改变层级，要是想在全屏的画布上面放一些东西是不可能的，比如这个改变速度，字号，，，这些的控制按钮或者可以在屏幕2/3的上部分做画布，1/3的下部分放控制器，控制器需要隐藏的时候，画布撑满全屏。感觉费劲！。目前，这个是web版本。效果html<div class="main">...

2018-03-19 15:42:43 695

原创 canvas弹幕方式从下往上~匀速直线运动~初版

<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <title>canvas匀速直线运动</title> <style> * { margin: 0; paddi

2018-03-19 10:33:28 715

原创选项卡切换（可优化使用下标）

html <header> <div id="aa" class="blo">1111</div> <div id="bb">222</div> <div id="cc">333</div> <div id

2018-03-16 10:57:33 283

原创防止频繁点击

html<button>按钮</button>script var a = 0; $("button").click(function() { if(a == 0) { a = 1; console.log("点击了"); setTimeout(function() { a = 0 }, 5000); } });...

2018-03-16 10:57:19 329

原创获取git参数

function getRequest() { //var urls = window.location.search; //获取url中"?"符后的字串 var urls = "www.baidu.com?&a=1&b=2&c=3"; var theRequest = new Object(); if(urls.indexOf("?") != -1) {...

2018-03-16 10:57:01 403

原创返回一个正常人能看懂的时间

function formatDate(now) { now = new Date(now * 1000); //函数内*1000 var year = now.getFullYear(), month = now.getMonth() + 1, date = now.getDate(), hour = now.getHours(), minu...

2018-03-16 10:56:52 293

原创复制内容

html<textarea id="aa" >s</textarea><button>按钮</button> 要复制区的标签为表单元素script $("button").click(function() { jsCopy(); }); function jsCopy() { $("#aa").select();

2018-03-16 10:56:37 245

原创让跳转新页面的栏目成为选中状态()

var url = location.href; $("ul li a").each(function() { if((url + '/').indexOf($(this).attr('href')) > -1 && $(this).attr('href') != "") { $(this).parents().addClass("act"); //让跳转新页面...

2018-03-16 10:56:27 1097

原创返回一个随机色值（动画随机彩色可改造）

console.log(randomColor()); function randomColor() { var rand = Math.floor(Math.random() * 0xFFFFFF).toString(16); if(rand.length == 6) { return rand; } else { return randomColor(); }...

2018-03-16 10:56:13 200

原创居中的套路(上下及左右居中)

html <div class="box"> <img src="1.png" alt="" /> </div>css *{margin:0;padding:0;} .box{ height:200px; width:400px; border:1px solid red; position:relative; } img{ po..

2018-03-16 10:55:43 317

原创只能让用户输入数字和小数点后最多能输入两位。

html<input type="text" id="money" /><span>查看输入的值</span>scriptvar str;$("#money").keyup(function() { var reg = /^\d+\.?(\d{1,2})?$/; while(!reg.test($(this).val()) &&amp

2018-03-16 10:55:26 2418

原创手机号验证

isphone(13012341234); function isphone(tel) { var reg = /^0?1[3|4|5|8][0-9]\d{8}$/; if(reg.test(tel)) { console.log("通过") } else { console.log("格式不对，大哥"); }; }...

2018-03-16 10:55:07 291

原创获取特殊字符后面所有字符（适用测试时只带一个参数的时候）

var hsrc = "http://127.0.0.1:8020/index.html?__hbt=6666666"; var index = hsrc.lastIndexOf("="); console.log(hsrc.substring(index + 1,hsrc.length));//6666666

2018-03-15 12:32:41 1170 1

原创获得字符串第一个字符和最后一个字符及扩展

var str = "Hello World"; console.log(str.substr(0,1));//H console.log(str.substr(-1));//d2018/04/08 追加：如果字符串是一个链接，想要获得图片参数，先获取最后5个字符再截取第一个字符（适用于git参数只有一个时且图片名称为一个字符的时候） ...

2018-03-15 12:09:37 36900 1

原创 css - 加载中...的动画

html <b>加载中</b> <a href=""><span>. .. ...</span></a>css a { text-decoration: none; display: inline-block; width: 12px; he

2018-03-15 12:01:48 334 3

原创 js-取0-9得到随机取4个数不重复的数字

html <input type="button" value="随机生成4位数" onclick="f1()">script function f1(){ var arr_4=new Array() function getRandom(min,max) //开始取数 { ...

2018-03-15 11:58:45 8788

原创 input-file图片预览

html <input type="file" name="file" onchange="showPreview(this)" /> <img id="portrait" src="" width="70" height="75">script function showPreview(source)

2018-03-15 11:55:22 172