sinat_24496253的博客

原创 可见区域加载图片

var aImages = document.images;loadImg(aImages);window.onscroll = function(){   loadImg(aImages);};function loadImg(arr){   for( var i = 0,len = arr.length; i        if(arr[i].getBounding

原创 时间格式

var date = new Date(+new Date()+8*3600*1000).toISOString().replace(/T/g,' ').replace(/\.[\d]{3}Z/,'');var str = "星期" + "日一二三四五六".charAt(new Date().getDay());$(".year").html(date);$(".week").html

原创 重绘和重拍

1.什么是重绘和重排重排：若渲染树的一部分更新，且尺寸变化，就会发生重排；重绘：部分节点需要更新，但不改变其他集合形状。如改变某个元素的颜色，就会发生重绘。2.重绘和重排何时会发生：（1）增加或删除DOM节点；（2）display:none（重排并重绘）；visibility:hidden（重排）；（3）移动页面中的元素；（4）增加或修改样式

原创 不想让按钮touch时有蓝色的边框或半透明灰色遮罩

1 不想让按钮touch时有蓝色的边框或半透明灰色遮罩（根据系统而定）方式一-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-user-modify:read-write-plaintext-only; //-webkit-user-modify有个副作用，就是输入法不再能够输入多个字符方式二meta name="msappl

原创 hbuilder autoprefixer配置

http://www.cnblogs.com/lxk0301/p/6428755.html

原创 实现前端图片排序，并将排序结果传给后台

排序img{cursor: pointer;width:20%;margin:10px}$(function() {$(".sortable").sortable({update: function(event, ui) { //更新排序之后var categoryids = $(this).sorta

原创 微信浏览器禁止页面下拉查看网址（不影响页面内部scroll）

function stopDrop() {       var lastY;//最后一次y坐标点       $(document.body).on('touchstart', function(event) {           lastY = event.originalEvent.changedTouches[0].clientY;//点击屏幕时记录最后一次Y度坐标。   

原创 吸顶+锚点

38demohtml,body{width:100%;height:100%;}.title{width:100%;background: #fff;}.titleTap{position:fixed;left:0;top:0;}.title li{width:33%;float:left;text-align: cent

原创 window.location.reload

function reloadPage() { window.location.reload() }<input type="button" value="Reload page"onclick="reloadPage()" />

原创 点击其他地方隐藏

点击其他地方隐藏xdgd            $("#a").on("click", function(e){            $("#menu").show();            $(document).one("click", function(){                $("#menu").hide();     

原创 layer插件问题

top.layer.alert("活动ing", function(){iosAndroidId(id);});执行完前面的之后，执行后面的函数当时没有把执行的函数放在里面，导致js的执行出现问题，找了很久也没找到问题，谨记好好了解用法，再开始使用

原创 点击其他地方弹层消失

点击其他地方弹层消失body,html{width:100%;height:100%;}.opciaty{width:200px;height:200px;background:#000;opacity:0.5;filter:alpha(opacity=5);position:absolute;top:50%;left:50%;margi

原创 倒计时

倒计时js    00天    00时    00分    00秒    function getRTime(){        var EndTime= new Date('2017/02/14 10:00:00');         var NowTime = new Date();        var t =EndTime.get

转载 滚动条滚动到底部和顶部

无标题页                $(document).ready(function() {            $(window).scroll(function() {                //$(document).scrollTop() 获取垂直滚动的距离                //$(document).

原创 点击其他地方菜单隐藏

点击其他地方隐藏xdgd$("#a").on("click", function(e){   $("#menu").show();   $(document).one("click", function(){       $("#menu").hide();   });   e.stopPropagation();});$("

转载 3d拖拽相册

BY 前端大队长  www.mogubolg.win-->     3D拖拽相册       body{      background-color:#000;     }     *{      padding:0px;      margin:0px;     }#perspective{ perspective: 1000px;

转载 文字无缝向上滚动

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">无缝向上滚动*{margin:0;padding:0;font-size:12px;}li{list-style:none;}.box{margin:20px;width:320px;height:195px;border:10px solid #dd

原创 二维码下载判断

二维码下载                        /*             * 智能机浏览器版本信息:             *             */            var browser = {                versions: function() {                    var u = nav

转载 下划线

js*{margin: 0;padding: 0;}.nav-box{position: relative;}ul{overflow: hidden;list-style: none;height: 40px;line-height: 40px;background-color: #000;}ul li{float: left;pad

原创 强制H5在微信端打开

var ua = navigator.userAgent.toLowerCase();var isWeixin = ua.indexOf('micromessenger') != -1;var isAndroid = ua.indexOf('android') != -1;var isIos = (ua.indexOf('iphone') != -1) || (ua.indexOf('

原创 移动端时间选择器

LazyPicker

原创 又可输入又可下拉的框

原创 $on、$emit和$broadcast的使用

$emit只能向parent controller传递event与data$broadcast只能向child controller传递event与data$on用于接收event与data

原创 draggable拖动事件

jQuery UI 拖动（Draggable） - 默认功能            #draggable { width: 150px; height: 150px; padding: 0.5em; }      $(function() {    $( "#draggable" ).draggable({ axis: "y" }); $( "#drag

原创 拖动draggable

jQuery UI 拖动（Draggable） - 默认功能            #draggable { width: 150px; height: 150px; padding: 0.5em; }      $(function() {    $( "#draggable" ).draggable({ axis: "y" });$( "#dragg

原创 css3前缀

1.第一个是prefix free，这是一个JS文件，大小2kb，导入之后你根本都无须考虑前缀问题，直接写不需要任何浏览器的前缀；2.第二个是css3 please，这个权当一个css3前缀参考吧，有注释说明的，一看就知道；3.而是应用编辑器，运用各个编辑器的自动完成（目前我定义了editplus和sublime text的自动完成），可以事先定义好，然后写一个自动出来多个，当

原创 吸顶导航

导航菜单固定头部跟随屏幕滚动jQuery插件$(function() {$('.nav').posfixed({distance: 0,pos: 'top',type: 'while',hide: false});});说 明使 用参 数兼 容body

原创 ionic

1.安装问题http://www.jianshu.com/p/5a99334eb62d          http://blog.csdn.net/capmiachael/article/details/523689162.

原创 进度条 bootstrap

Bootstrap 实例 - 进度条https://cdn.static.runoob.com/libs/bootstrap/3.3.7/css/bootstrap.min.css">https://cdn.static.runoob.com/libs/jquery/2.1.1/jquery.min.js">https://cdn.static.runoob.com/libs/boot

原创 AngularJS的模块

1.这种方法有以下几个优点：1) 使用声明的方式，让人更加容易理解。2) 你可以更加容易的让你的代码进行重用。3) 模块的加载顺序就更加容易控制了。因为这些模块是延迟执行的。4) 对于进行单元测试就变得更加的方便了。更加可靠，你只需要载入这个模块就可以进行测试了。5) 端对端的测试中，你可以使用模块去重写配置。2. 引用了myApp 模块。 这既是告诉启

原创 ng-class与class的区别

1.ng-class是根据 key: value来设置class2.ng-class="{'IM_selected':(status.currTalkTo.FRIENDID==item.FRIENDID)}"这是js的语法，解释如下： 如果status.currTalkTo.FRIENDID == item.FRIENDID 对等，就显示 IM_selected，否则就不显示

转载 JS判断访问设备、客户端操作系统类型

先给出一个实例：判断windows、linux、android判断操作系统function detectOS() { var sUserAgent = navigator.userAgent; var isWin = (navigator.platform == "Win32") || (navigator.platform == "Windows"); v

转载 js判断用户的浏览设备是移动设备还是PC

根据用户的访问设备的不同来显示不同的页面样式，主要是判断移动设备还是电脑浏览器访问的。        function browserRedirect() {            var sUserAgent = navigator.userAgent.toLowerCase();            var bIsIpad = sUserAgent.match(/ipad/i

原创 网站中浏览器滚动条问题

在写网站时，把滚动条的位置留出来，html{width：100%} body{overflow-y:scroll}

原创 用js判断设备的宽度，加载不同的css和js

//获取屏幕宽度，检测是否大于720var screen_width = document.documentElement.clientWidth > 1000 ? true : false ;(function(){   //获取head对象   var head = document.getElementsByTagName('HEAD')[0];   //创建link对象

原创 设备类型问题

获取设备信息 navigator.userAgent.toLowerCase();浏览器属性  navigator.userAgent设备像素比 devicePixelRatio判断设备的宽度

原创 页面加载3s后，kk消失

function load() {setTimeout(function() {$(".kk").hide();}, 3000);}