分类 前端技术 下的文章

那么今天我们就针对上面的问题，一起来探讨一下CSS3 Media Queries在各种不同设备（桌面，手机，笔记本，ios等）下的模板制作。那么Media Queries是如何工作的？那么有关于他的工作原理大家要是感兴趣的话可以参考《CSS3 Media Queries》一文，里面已经做过详细的介绍，这里就不在进行过多的阐述。CSS3 Media Queries模板CSS3 Media Queries一般都是使用“max-width”和“min-width”两个属性来检查各种设备的分辨大小与样式表所设条件是否满足，如果满足就调用相应的样式。打个比方来说，如果你的Web页面在- 阅读剩余部分 -

Media Queries直译过来就是“媒体查询”，在我们平时的Web页面中head部分常看到这样的一段代码： <link href="css/reset.css" rel="stylesheet" type="text/css" media="screen" /> <link href="css/style.css" rel="stylesheet" type="text/css" media="al- 阅读剩余部分 -

gulpjs是一个前端构建工具，与gruntjs相比，gulpjs无需写一大堆繁杂的配置参数，API也非常简单，学习起来很容易，而且gulpjs使用的是nodejs中stream来读取和操作数据，其速度更快。如果你还没有使用过前端构建工具，或者觉得gruntjs太难用的话，那就尝试一下gulp吧。本文导航：gulp的安装开始使用gulpgulp的API介绍一些常用的gulp插件1、gulp的安装首先确保你已经正确安装了nodejs环境。然后以全局方式安装gulp：npm install -g gulp 全局安装gulp后，还需要在每个要使用gulp的项目中都单独安装一次。把- 阅读剩余部分 -

var fastAJax = function(args) { var xmlhttp = null; if (window.XMLHttpRequest) { xmlhttp = new XMLHttpRequest(); } else if (window.ActiveXObject) { xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); } if (xmlhttp == null) { args.handler(- 阅读剩余部分 -

/** * Created by liweiliang on 2017/7/18 QQ:406320591. */ function tow(n) { return n >= 0 && n < 10 ? '0' + n : '' + n; } function countDown(){ var end = +new Date("2017-07-25 00:00:00"),//获取指定日期对象 start = +new Date(),//获取现在日期对象 second = Math.floor((end - start)- 阅读剩余部分 -

将下面代码添加到 typecho 头部模版的开头即可实现简单的 JSON 输出，实现 API 效果。API 的使用大家就自己发挥吧。头部模版一般位于usr/themes/default/header.php 可以查找到：<!DOCTYPE html> 在这一行的前面添加下面的代码：<?php if (stripos($this->request->getRequestUri(), 'json')) { $arr = array(); while ($this->next()) { $a = array('t- 阅读剩余部分 -

单行文本溢出.text-ellipsis { text-overflow:ellipsis; white-space:nowrap; overflow:hidden; } 多行文本溢出.multiple-text-ellipsis { display: -webkit-box; overflow : hidden; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } jQuery实现文本溢出funct- 阅读剩余部分 -

A4纸的尺寸是210mm297mm，也就是21.0cm29.7cm，而1英寸=2.54cm，如果屏幕DPI分辨率为72像素/英寸，换算一下：相当于1cm可呈现 (72px/2.54cm) = 28.34px下面是一些常用分辨率下A4纸在屏幕上的像素尺寸：分辨率是72像素/英寸时，A4纸的尺寸的图像的像素是595×842；分辨率是96像素/英寸时，A4纸的尺寸的图像的像素是794×1123；(默认)分辨率是120像素/英寸时，A4纸的尺寸的图像的像素是1487×2105；分辨率是150像素/英寸时，A4纸的尺寸的图像的像素是1240×1754；分辨率是300像素/英寸时，A4- 阅读剩余部分 -

监听屏幕的改变：<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, width=devic- 阅读剩余部分 -

1、关于call()和apply()的疑点：apply和call的区别在哪里什么情况下用apply,什么情况下用callapply的其他巧妙用法（一般在什么情况下可以使用apply）2、语法和参数分析：apply和call都能继承另外一个对象的方法和属性； Function.apply(obj,args)方法能接收两个参数obj：这个对象将代替Function类里this对象args：这个是数组，它将作为参数传给Function（args-->arguments）call:和apply的意思一样,只不过是参数列表不一样.Function.call(obj,[param- 阅读剩余部分 -

关闭当前页面，相信不少人在开发中都遇到过这个需求，但面对这么多的浏览器，要做到js的兼容还需要做特殊的处理。关于这方面网上有很多的资料，但大多都是复制粘贴的，没有达到兼容的效果，或者是效果不好。//FF中需要修改配置window.close方法才能有作用，为了不需要用户去手动修改，所以用一个空白页面显示并且让后退按钮失效 //Opera浏览器旧版本(小于等于12.16版本)内核是Presto，window.close方法有作用，但页面不是关闭只是跳转到空白页面，后退按钮有效，也需要特殊处理 var userAgent = navigator.userAgent; if (u- 阅读剩余部分 -

JS实现局部打印和预览：第一种：JS 实现简单的页面局部打印function preview(oper) { if (oper < 10)...{ bdhtml=window.document.body.innerHTML;//获取当前页的html代码 sprnstr="<!--startprint"+oper+"-->";//设置打印开始区域 eprnstr="<!--endprint"+oper+"-->";//设置打印结束区域 - 阅读剩余部分 -

/** * * ━━━━━━神兽出没━━━━━━ * 　　　┏┓　　　┏┓ * 　　┏┛┻━━━┛┻┓ * 　　┃　　　　　　　┃ * 　　┃　　　━　　　┃ * 　　┃　┳┛　┗┳　┃ * 　　┃　　　　　　　┃ * 　　┃　　　┻　　　┃ * 　　┃　　　　　　　┃ * 　　┗━┓　　　┏━┛Code is far away from bug with the animal protecting * 　　　　┃　　　┃ 神兽保佑 * 　　　　┃　　　┃ 代码无bug * 　　　　┃　　　┗━━━┓ * 　　　　┃　　　　　　　┣- 阅读剩余部分 -

hasOwnProperty()函数用于指示一个对象自身(不包括原型链)是否具有指定名称的属性。如果有，返回true，否则返回false。该方法属于Object对象，由于所有的对象都"继承"了Object的对象实例，因此几乎所有的实例对象都可以使用该方法。IE 5.5+、FireFox、Chrome、Safari、Opera等主流浏览器均支持该函数。语法object.hasOwnProperty( propertyName ) 参数 参数 描述 propertyName String类型指定的属性名称 返回值hasOwnProperty()函数的返回值为Bool- 阅读剩余部分 -

写js的时候需要遍历一个对象的属性，把属性名和属性值都提出来，之前没遇到这种需求，查了一下可以用for in的方式.var obj = { "key1":"value1", "key2":"value2", "key3":"value3" }; function EnumaKey(){ for(var key in obj ){ alert(key); } } function EnumaVa- 阅读剩余部分 -

window.document.onkeydown = function (e) { var evt = window.event || e;//兼容性处理 var keycode = evt.keyCode; switch (keycode) { case 37://左 pgwSlideshow.previousSlide(); break; case 39://右 pgwSlideshow.nextSlide(); - 阅读剩余部分 -

event.keyCode列表Keycode对照表 字母和数字键的键码值(keyCode) 按键 键码 按键 键码 按键 键码 按键 键码 A 65 J 74 S 83 1 49 B 66 K 75 T 84 2 50 C 67 L 76 U 85 3 51 D 68 M 77 V 86 4 52 E 69 N 78 W 87 5 53 F 70 O 79 X 88 6 54 G 71 P 80 Y 89 7 55 H 72 Q 81 Z 90 8 56 I 73 R 82 0 48 9 57 数字键盘上的键的键码值(k- 阅读剩余部分 -

对象的合并需求：设有对象 o1 ,o2,需要得到对象 o3var o1 = { a:'a' }, o2 = { b:'b' }; // 则 var o3 = { a:'a', b:'b' } 方法1：使用JQuery的extend方法 **方法定义**：jQuery.extend([deep], target, object1, [objectN]) > 用一个或多个其他对象来扩展一个对象，返回被扩展的对象。 　　　> 如果不指定target，则给jQuery命名空间本身进行扩展。这有助于插件作者为jQuery增加新方法。 如果第一个参数设置为t- 阅读剩余部分 -

1.For...In 声明用于对数组或者对象的属性进行循环/迭代操作。　　对于数组 ，迭代出来的是数组元 素，对于对象 ，迭代出来的是对象的属性；var x var mycars = new Array() mycars[0] = "Saab" mycars[1] = "Volvo" mycars[2] = "BMW" for (x in mycars) { document.write(mycars[x] + "<br />") } - 阅读剩余部分 -

Handlebars 为你提供了一个可以毫无挫折感的高效率书写 语义化的模板 所必需的一切。Mustache 模板和 Handlebars 是兼容的，所以你可以把Mustache模板拿来导入到Handlebars中，并开始使用Handlebars所提供的更丰富的功能。开始Handlebars模板看起来就像是正常的Html，并使用了嵌入的 handlebars 表达式。<div class="entry"> <h1>{{title}}</h1> <div class="body"- 阅读剩余部分 -

View Code　　然后查找 net,nte,ent,etn,ten,tne最终找到了“ten”：　　根据上下文环境得知这里就是显示快速选择的方法了，然后就搜索所有调用过此方法的地方，到这里，问题本身已经解决了，只要把 参数A置为0或者false就不会出现广告链接了，但是人家说了免费代码不能改动核心库。因此继续。。查找_fillQS，发现在配置文件中的一个调用：　　配置文件是可以随意修改的，如果不想屏蔽右键菜单就直接去掉这句，否则可以把调用方法的1改为0等，就不会出现广告链接。　　至此，此次问题解决完成。

js的批量定义和批量赋值是有差异的，笔记一下，省的下次在被坑purp_option.series[0].data = purp_option.title.text = null; //可行 当 var filterAlldata = filterdata= []; 时如果其中一个变量的值push改变那么另外一个变量的值也会对应的改变，这是个坑

第一:gulp必须在nodejs环境下运行，所以要先搭建nodejs环境。测试nodejs是否安装正常。命令：node -v 如果返回版本号说明安装正常然后再 npm init 会自动生成一个package.json文件。这个文件保存项目的相关信息第二:npm install gulp -g 安装全局gulp 然后在项目里的根目录再安装一遍 npm install gulp –save-dev 第三:新建一个gulpfile.js文件然后安装js代码检测插件，压缩文件插件，重名名插件(这里只讲一下这三个插件的使用，当然gulp还有很多强大的插件)js代码检测插件：npm i- 阅读剩余部分 -

Building With Gulp===================原文地址翻译出处原创翻译，有不当的地方欢迎指出。转载请指明出处。谢谢！对网站资源进行优化，并使用不同浏览器测试并不是网站设计过程中最有意思的部分，但是这个过程中的很多重复的任务能够使用正确的工具自动完成，从而使效率大大提高，这是让很多开发者觉得有趣的地方。Gulp是一个构建系统，它能通过自动执行常见任务，比如编译预处理CSS，压缩JavaScript和刷新浏览器，来改进网站开发的过程。通过本文，我们将知道如何使用Gulp来改变开发流程，从而使开发更加快速高效。What Is Gulp?Gulp是一个构- 阅读剩余部分 -

TodoMVC 选择适合项目的MVC框架不再纠结。又一个新的项目开始了，可是还在犯愁该使用什么MVC框架才适合现在的项目。不知道大家有没有过类似的经历，我是曾经纠结过的。TodoMVC 这款工具应该可以解决你的烦恼。TodoMVC 是这样介绍自己的：Backbone、Ember、 AngularJS等等，有这么多优秀的MVC框架可以选择，每个MVC框架看上去都是那么的特别。唉！选择多了也会让人苦恼。TodoMVC 会对你做出正确的选择有很大的帮助，推荐大家使用！官方网站：http://todomvc.com/软件下载：https://github.com/tastejs/t- 阅读剩余部分 -
  1. 1
  2. 2
  3. 3
  4. 4
  5. 5
  6. 6
  7. 7