- 博客(22)
- 资源 (1)
- 收藏
- 关注
原创 nodejs中获取内网ip地址
今天同事有个需求,希望用nodejs里的web服务器的对应的站点可以支持内网访问,后来发现修改express里的hostname属性为自己的内网ip就可以了。但是问题是,我们的机器都是自动获取内网ip,那么这次写死的hostname下次基本上就不能用了,于是我们想到了在nodejs里动态获取内网ip,并且把值赋给express的open方法就可以了,于是我按照这个思路开工了。我们先了解怎么获取
2014-11-27 17:10:05 5513
转载 grunt常用模块
grunt.initConfig方法用于模块配置,它接受一个对象作为参数。该对象的成员与使用的同名模块一一对应。每个目标的具体设置,需要参考该模板的文档。就cssmin来讲,minify目标的参数具体含义如下:expand:如果设为true,就表示下面文件名的占位符(即*号)都要扩展成具体的文件名。cwd:需要处理的文件(input)所在的目录。src:表示需要处理的文件。
2014-11-25 10:45:47 874
转载 RequireJS和Backbone的集成
有朋友留言RequireJS如何与Backbone集合使用。 这两个轻量级的库合起来使用确实能够方便的构建大型应用程序。RequireJS填补了前端模块化开发的空缺,Backbone采用MVC的分层结构很好的将程序各个部分解耦。Backbone目前不支持AMD(曾经支持过),那么它只能作为普通的JS文件使用。它全局的标示符是Backbone,它还依赖于underscore,
2014-11-24 18:36:38 747
转载 RequireJS进阶(三)
进阶的前面两篇讲述了r.js如何通过命令行把所有的模块压缩为一个js文件或把所有的css压缩为一个css文件。其中包括一些压缩配置参数的使用。 但以上两种方式有几个问题1、通过命令手动配置压缩选项显得很呆板2、都仅合并为一个文件对于最后只生成一个文件的库来说,这种方式并无不妥。比如jQuery,它的工程中小文件有20多个,打包后只有一个jquery-1.x.x.
2014-11-24 18:33:36 583
转载 RequireJS进阶(二)
这一篇来认识下打包工具的paths参数,在入门一中就介绍了require.config方法的paths参数。用来配置jquery模块的文件名(jQuery作为AMD模块时id为“jquery”,但文件名可通过paths配置可以不必是“jquery.js”,而是带有版本的如“jquery-1.7.2.js”)。 在入门一中,jquery-1.7.2.js和main.js都在一个域中,
2014-11-24 18:29:05 464
转载 RequireJS进阶(一)
为了应对日益复杂,大规模的JavaScript开发。我们化整为零,化繁为简。将复杂的逻辑划分一个个小单元,各个击破。这时一个项目可能会有几十个甚至上百个JS文件,每个文件为一个模块单元。如果上线时都是这些小文件,那将对性能造成一定影响。 RequireJS提供了一个打包压缩工具r.js来对模块进行合并压缩。r.js非常强大,不但可以压缩js,css,甚至可以对整个项目进行打包。
2014-11-24 17:28:25 518
转载 RequireJS 2.0 正式发布
就在前天晚上RequireJS发布了一个大版本,直接从version1.0.8升级到了2.0。随后的几小时James Burke又迅速的将版本调整为2.0.1,当然其配套的打包压缩工具r.js也同时升级到了2.0.1。此次变化较大,代码也进行了重构,层次更清晰可读。功能上主要变化如下: 1,延迟模块的执行。这是一个很大变化,以前模块加载后factory立马执行。性能上肯
2014-11-24 16:56:56 591
转载 RequireJS入门(三)
这篇来写一个具有依赖的事件模块event。event提供三个方法bind、unbind、trigger来管理DOM元素事件。event依赖于cache模块,cache模块类似于jQuery的$.data方法。提供了set、get、remove等方法用来管理存放在DOM元素上的数据。示例实现功能:为页面上所有的段落P元素添加一个点击事件,响应函数会弹出P元素的innerHTML。
2014-11-24 16:23:27 577
转载 Snandy Stop, thinking is the essence of progress. RequireJS入门(二)
上一篇是把整个jQuery库作为一个模块。这篇来写一个自己的模块:选择器。为演示方便这里仅实现常用的三种选择器id,className,attribute。RequireJS使用define来定义模块。 新建目录结构如下这次新建了一个子目录js,把main.js和selctor.js放入其中,require.js仍然和index.html在同一级目录。
2014-11-24 16:01:19 638
转载 RequireJS入门(一)
RequireJS由James Burke创建,他也是AMD规范的创始人。 RequireJS会让你以不同于往常的方式去写JavaScript。你将不再使用script标签在HTML中引入JS文件,以及不用通过script标签顺序去管理依赖关系。 当然也不会有阻塞(blocking)的情况发生。好,以一个简单示例开始。 新建一个目录,结构如下
2014-11-24 15:21:41 566
转载 [译]Autoprefixer:一个以最好的方式处理浏览器前缀的后处理程序
Autoprefixer解析CSS文件并且添加浏览器前缀到CSS规则里,使用Can I Use的数据来决定哪些前缀是需要的。 所有你需要做的就是把它添加到你的资源构建工具(例如 Grunt)并且可以完全忘记有CSS前缀这东西。尽管按照最新的W3C规范来正常书写你的CSS而不需要浏览器前缀。像这样: a{ transition :transform
2014-11-20 11:25:58 777
转载 《jQuery权威指南》学习笔记之第4章 jQuery中的事件与应用
4.1 事件机制事件触发后的两个阶段:捕获(capture)(不支持) 冒泡(bubbling):事件执行的顺序示例4-1 事件中的冒泡现象[html] view plaincopyhtml> head> title>title> style type="text/css"
2014-11-18 11:01:31 682
转载 sublime Text2技巧以及emmet(Zen Coding)快速编写HTML
作为一个前端,有一款好的开发利器是必不可少的,editplus、notepad++都是不错的工具,体积轻巧,启动迅速(dw太浮肿了)。Sublime Text2是一款跨平台的编辑器,是一款具有代码高亮、语法提示、自动完成且反应快速的编辑器软件,不仅具有华丽的界面,还支持插件扩展机制。zen coding 一种快速编写HTML/CSS代码的方法,已改名为Emmet,并且搭建了一个新的网站:d
2014-11-17 11:07:47 938
转载 JavaScript Source Map详解
摘要:Source map就是一个信息文件,里面储存着位置信息。也就是说,转换后的代码的每一个位置,所对应的转换前的位置。上周,jQuery 1.9发布。这是2.0版之前的最后一个新版本,有很多新功能,其中一个就是支持Source Map。访问 http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.mi
2014-11-13 17:11:22 812
转载 【疯狂的菊花系列】用CSS3帧动画实现Loading
一直以来,本人都认为css3的animation只能实现渐变动画,比如高度从0渐变到100px这类的。而无法实现高度从0跳变到50px再跳变到100px这种类似flash的帧动画效果。但是在看到天才的师姐给的例子之后, 让我愧疚得无地自容,原来还真有css3帧动画的,T_T。这个属性是 timing-function: step-end; 而且firefox、webkit、ie10都有支持
2014-11-12 12:42:47 2147
转载 Grunt中批量无损压缩图片插件--Grunt-contrib-imagemin
Photoshop 切出的图片,无论是 PNG 还是 JPEG/JPG 格式,都含有许多相关信息,又或多余的颜色值,这些信息和颜色值,对网页前端并没有用处,反而增加图片大小,所以 Google Pagespeed 最佳实践建议我们用 jpegtran 或 jpegoptim (仅限 Linux 平台) 对 jpeg/jpg 图片进行无损压缩,如果是 PNG 格式,则使用 OptiPNG 或 P
2014-11-10 15:07:12 958
转载 Sass进阶
先简单的说一下 Sass 这个东西。CSS 是一些非常基础简单得语句的组合,既然简单的语句,就不可避免的有很多重复,冗余的东西。而且没有传统编程语言变量、控制语句等高级特性,所以造成了 CSS 编写低效,往往需要通过查找替换、大量复制来修改或者编写。Sass 就是用来弥补这个缺陷,为 CSS 提供额外的高级功能,使其开发更加方便快捷,更加方便管理。所以你需要使用 Sass 的语法来编写代码
2014-11-08 19:28:20 665
转载 几种display:table-cell的应用
摘要:display:table-cell属性指让标签元素以表格单元格的形式呈现,类似于td标签。目前IE8+以及其他现代浏览器都是支持此属性的,但是IE6/7只能对你说sorry了,这一事实也是大大制约了display:table-cell属性在实际项目中的应用。一、display:table-cell属性简述display:table-cell属性指让标签元素以表格单元格的形式
2014-11-06 10:48:56 697
转载 可做刮刮卡的图像擦除插件jQuery eraser
jquery.eraser是一款使用鼠标或触摸的动作来擦除画布显示真正图片的插件。jquery.eraser插件的原理是用一个画布遮住图片,然后根据触摸或鼠标输入来擦除画布显示图片,您可以在参数中指定一个回调函数设置画笔大小。使用需知:必须确保图片是完全加载之后调用eraser(),否则它不会工作。插件正常运行在Safari,Chrome OS X和Windows,An
2014-11-04 14:38:04 2270 1
转载 easy-animation | Animation for Sass
最近因为项目缘故,勾搭上了Sass。其实在折腾Sass之前,也有简单用过一下Less。但碍于Less提供的一些API实在让人觉得有点多余,用着就是不顺手,最后就不了了之啦。Sass之所以用起来舒服和顺手,很大程度上是因为Compass的存在。Compass提供的足够丰富的API,简直让你觉得写CSS是一种享受。不过...Compass居然不支持animation!对
2014-11-04 12:58:35 779
转载 Animate.css
Animate.css是由Dan Eden的Daniel Eden使用CSS3的animation制作的动画效果的CSS集合。换句话说:Animate.css就是一大堆的很酷,很有趣,而且很炫又能跨浏览器的动画效果样式集锦,你可以直接使用到您的项目中。要在你的项目中使用,简单的很,就是三步完成:HTML Markup div id="test">testdiv>
2014-11-03 18:13:11 906
转载 手机浏览器客户端交互设计适配之——屏幕大小
以下内容来自于淘宝UED随着各个手机操作系统的应用平台的上线,几乎所有的互联网应用都在往手机上迁移。然而手机与PC 不一样,PC经过了多年的发展,在设计上形成了很多不成文的规则,如网页的宽度都在960px左右【当然,由于整体的电脑屏幕往大尺寸及高分辨发展,除了背景宽屏自适应外,不少网页也正朝着更宽的方向上发展】。当前的手机种类繁多,手机屏幕的大小、比例各异,并且手机的屏幕本身就小,因此既要
2014-11-03 18:05:10 1701
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人