201508-08 CSS3 动画简析 CSS3属性中有关于制作动画的三个属性:Transform,Transition,Animation;我们一起学习完了Transform和Transition,让我们对元素实现了一些基本的动画效果,这些我想足以让大家激动了一阵子,今天我们趁着这个热劲继续第三个动画属性Animation的学习,单从A.... Read More >
201507-15 HTML5十五大新特性 HTML5想必大家都很熟悉了。然而,你能准确地说出HTML5带来了哪些新特性吗?本文总结了HTML5带来的15项你必须知道的新特性。 一起来看下: 1.新的文档类型 (New Doctype) 目前许多网页还在使用XHTML 1.0 并且要在第一行像这样声明文档类型: 1.<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0.... Read More >
201506-10 $(document).ready()与$(window).load()的区别 虽说很早就开始接触JavaScript,自己也用JavaScript编写过许多代码,如之前的web版码表计时器,就写了近500行代码,函数也写了10个左右。当时也就是想到哪里就写到哪里,行不通就另外找方法,根本不会考虑代码的性能、作用及优化。 随着在实践中对JavaScript的应用,对JavaScript的认识也在不断地深入。这里,就为大家介绍一下$(document).ready()于$(w.... Read More >
201505-07 移动端自适应:flexible.js可伸缩布局使用 阿里团队开源的一个库。flexible.js,主要是实现在各种不同的移动端界面实现一稿搞定所有的设备兼容自适应问题。 实现方法: 通过JS来调整html的字体大小,而在页面中的制作稿则统一使用rem这个单位来制作。关键代码如下: ;(function(win, lib) { var doc = win.document; var docEl = doc.documentE.... Read More >
201504-02 JavaScript代码放在HTML代码哪里比较好 本文总结了多种放置JS代码的方法,需要的朋友可以参考下 在哪里放置 JavaScript 代码? 通常情况下,JavaScript 代码是和 HTML 代码一起使用的,可以将 JavaScript 代码放置在 HTML 文档的任何地方。但放置的地方,会对 JavaScript 代码的正常执行会有一定影响,具体如下所述。 放置于<head></head>之间.... Read More >
201503-09 Sass基础——Sass函数 在Sass中除了可以定义变量,具有@extend,%placeholders和Mixins等特性之外,还自备了一系列的函数功能。有字符串函数、数字函数、列表函数、Introspection函数以及三元函数等,当然大家还可以根据需求自定义函数。 在这篇文章中,我们主要对Sass函数中的字符串函数、数字函数、列表函数、Introspection函数以及三元函数的功能能使用做一些简单的介绍,希望对.... Read More >
201503-05 [转]页面在360浏览器下的兼容性问题解决 问题的提出: Web页面在360的浏览器上,显示不正确。 但是在Firefox、chrome和IE8+以上的浏览器上,都是显示正常的。 问题的分析 1. 检查了一些Javascript框架,标准的jquery类库1.x系列,确认其工作正常,问题不是在于Javascript方面。 2. 排查掉HTML标签内容的显示 问题。 3. 怀疑是CSS在不同浏览器下的兼容性.... Read More >
201412-24 Grunt从入门到自定义项目模板 一.Grunt入门介绍 1. Grunt是神马 基于任务的命令行构建工具(针对JavaScript项目) 链接:http://gruntjs.com/ 2. 使用Grunt的理由 前端的工具算得上是五花八门,在介绍如何Grunt之前,首先我们得反问自己: G.... Read More >
201412-04 [转]互娱新官网品牌站-背后的重构技术 项目背景 2014年4月16日,由中国领先的互联网综合服务商腾讯公司举办的“UP2014腾讯互动娱乐年度发布会”在北京国家会议中心举行,互娱官网的品牌站 http://ieg.tencent.com/ 也同一时间发布。TGideas 对这一次的官方网改版进行了包装,在本次改版中,页面重构上(小李刀.... Read More >
201412-04 HTML5 拍照应用开发经历的那些坑儿 一、项目简介 1.1、项目背景: 这是一个在移动终端创新应用的项目,用户在浏览器端(微信/手Q)即可完成与金秀贤的合影,希望通过这样一种趣味体验,引发用户的分享与转发的热潮。 1.2、系统要求: ios6-ios7、android3.0-android4.3、android4.4+(非.... Read More >
201411-05 [转] 网页浏览毫秒必争,超强前端网页性能总结三 用 link 代替@import 避免使用@import的原因很简单,因为它相当于将css放在网页内容底部。 避免使用Filters AlphaImageLoad也是IE5.5 – IE8中支持,这种滤镜的使用会导致图片在下载的时候阻塞网页绘制,另外使用这种滤镜会导致内存使用量的问题。I.... Read More >
201411-05 [转] 网页浏览毫秒必争,超强前端网页性能总结二 避免404 404我们都不陌生,代表服务器没有找到资源,我们要特别要注意404的情况不要在我们提供的网页资源上,客户端发送一个请求但是服务器却返回一个无用的结果,时间浪费掉了。 更糟糕的是我们网页中需要加载一个外部脚本,结果返回一个404,不仅阻塞了其他脚本下载,下载回来的内容(404)客户端还会将其当成Javascript去解析。 服务器 使用CDN 再次强调第一条黄金.... Read More >
201411-05 [转]网页浏览毫秒必争,超强前端网页性能总结一 你愿意为打开一个网页等待多长时间?我一秒也不愿意等。但是事实上大多数网站在响应速度方面都让人失望。现在越来越多的人开始建立自己的网站,博客,你的网页响应速度如何呢?在这篇文章中我们来介绍一下提高网页性能的最佳实践,以及相应的问题解决方案。 最佳实践 最佳实践我们引用的来自yahoo前端性能团.... Read More >
201408-12 浅谈DIV+CSS两种盒子模型 利用CSS来布局页面布局DIV有点逻辑性! 重点理解盒子模型,标准流和非标准流的区别,还有定位原理!把这3个攻破了,就非常简单了!多实践多参考! 最后就是兼容问题了,在实践中自然就有经验了!这些兼容技巧都是经验来的! 继续阅读 → Read More >