资讯月刊下载
[Web前端]
让网站和APP更具动感的几点建议
【编者按】本文来自Smashing Magazine，作者为Brolik的联合创始人、首席创意官Drew Thomas。文中介绍了Web中增加动感设计可带来的好处及进行动感设计的几点建议，如采用图层技术、运用前后过渡及开发单页面应用。他还通过CSS3代码演示，进一步说明了动感设计的实现方式。下面为文章的简译内容。 数字体验越来越注重对现实的模拟，每天都在进步。特别是对物理世界的模拟，使用得越来越广 ...
[Web前端]
【精心挑选】帮助你实现元素动画的6款插件
现在的网页设计风格正在朝着扁平化发展，力求布局简洁，突出主题内容。而另一方面，网页交互则变得越来越多样性，让用户在操作的时候可以更愉悦。当下很流行给网页元素添加动画，随着 Web 技术的发展，动画的实现方式有多种：JavaScript、CSS3、SVG 以及 Canvas。这篇文章挑选6款帮助前端开发人员实现元素动画的插件。 1、Waves Waves 点击效果的灵感来自于 Google ...
[Web前端]
10个强大的纯CSS3动画案例分享
我们的网页外观主要由CSS控制，编写CSS代码可以任意改变我们的网页布局以及网页内容的样式。CSS3的出现，更是可以让网页增添了不少动画元素，让我们的网页变得更加生动有趣，并且更易于交互。本文分享了10个非常炫酷的CSS3动画案例，希望大家喜欢。 1、纯CSS3实现烧烤动画 这个CSS3动画相当有创意，动画中所有的烧烤元素都是利用CSS3绘制而成，冒出的烟雾也是由CSS3动画实现，相当酷。 在 ...
[Web前端]
9个GIF动画阐述Web设计的25年历史
Web设计25年的历史，可以用以下9个GIF动画来总结。 Froont，一家为web设计师制作工具的旧金山公司，用9个GIF格式动画来表现网页设计在过去25年的发展历程。如果你想知道为什么CSS这么重要，为什么Flash会逐渐淘汰，这些动画图或许能让你一窥究竟。 网页设计的单色时代，约1989年。想想Lynx和其他以Unix为基础的web浏览器，这些浏览器只会通过网络从这个终端到另一个终端一 ...
[Web前端]
Saber——模块化、组合式的移动前端框架
摘要：Saber是模块化、组合式的前端移动框架，其提供了JavaScript模块、CSS样式库与开发平台完整的前端解决方案。如果你想开发一款轻量级应用，那么它就是您一款不可或缺的开发工具。 Saber是模块化、组合式的前端移动框架，其提供了JavaScript模块、CSS样式库与开发平台完整的前端解决方案。主要适合做移动端SPA (Single Page App) 项目、轻应用。如果你想开发一款轻 ...
[Web前端]
关于编写性能高效的JavaScript事件的技术
如何能做出高效的web前端程序是我每次做前端开发都会不自觉去考虑的问题。几年前雅虎里牛逼的前端工程师们出了一本关于提升web前端性能的书籍，轰动了整个web开发技术界，让神秘的web前端优化问题成为了大街的白菜，web前端优化变成了菜鸟和大牛都能回答的简单问题，当整个业界都知道了惊天秘密的答案，那么现有的优化技术已经不能对你开发的网站产生的质的飞越，为了让我们开发的网站性能比别人的网站更加优秀，我们 ...
[Web前端]
7个你可能不认识的CSS单位
众所周知CSS技术我们虽然很熟悉，在使用的过程却很容易被困住，这让我们在新问题出现的时候变得很不利。 随着web继续不断地发展，对于新技术新解决方案的要求也会不断增长。因此，作为网页设计师和前端开发人员，我们别无选择，必须熟悉我们手上的工具，做到知己知彼，这样才能百战不殆。 这就意味着有那么些个特别的货，虽然平常都不怎么会用上，但是一旦某个地方需要它们了，他们就真的是特么得合适不过来了呢。 今儿 ...
[编程语言]
必须记住的 30 类 CSS 选择器
大概大家读知道`id`,`class`以及`descendant`选择器，并且整体都在使用它们，那么你正在错误拥有更大级别的灵活性的选择方式。这篇文章里面提到的大部分选择器都是在CSS3标准下的，所以它们只能在相应最新版本的浏览器中才能生效，你完全应该把这些都记在你聪明的脑袋里面。 1. * * { margin: 0; padding: 0; } 在我们看比较高级的选择器之前，应该认识下这个众所周 ...
[Web前端]
CSS生日快乐：CSS之父Håkon Wium Lie访谈录
20年前的今天（10月10日），Opera CTO Håkon Wium Lie发布Cascading HTML style sheets – a proposal。假如Paul McCartney是一名Web开发者，并在今天写下《Sergeant Pepper's Lonely Hearts Club Band》，那他一定会这样写： It was twenty years ago today ...
[非技术]
前端工程师应该具备的三种思维
如果你是一个天才等级的工程师（马上可以离开），可以独立完成一个很多事情，你可以是一个怪咖，因为我相信没有一个人不会不佩服你。但现实归现实，多数人都不是天才，而我们在职场上也不是单打独斗，我们需要团队合作，需要协调和配合，需要考虑除了代码以外的更多事情。 前端工程师，也不仅仅只是负责接资料，捞数据，做个回应。当然只做这些也并没有不对，但我们需要和后端工程师沟通，我们也需要和设计沟通，也需要和 P ...
[Web前端]
12个你未必知道的CSS小知识
虽然CSS并不是一种很复杂的技术，但就算你是一个使用CSS多年的高手，仍然会有很多CSS用法/属性/属性值你从来没使用过，甚至从来没听说过。 1.CSS的color属性并非只能用于文本显示 对于CSS的color属性，相信所有Web开发人员都使用过。如果你并不是一个特别有经验的程序员，我相信你未必知道color属性除了能用在文本显示，还可以用作其它地方。 你可以先看一下下面的演示： HTML代码 ...
[Web前端]
提升你网站水平的的前端交互效果【附源码】
这里集合的这组 HTML5 & CSS3 效果，有的是网站开发中常用的、实用的功能，有的是先进的 Web 技术的应用演示。不管哪一种，这些案例中的技术都值得我们去探究和学习。 超炫的 HTML5 粒子效果进度条 我喜欢粒子效果作品，特别是那些能够应用于实际的，例如这个由 Jack Rugile 基于 HTML5 Cavnas 编写的进度条效果。看着这么炫的 Loading 效果，即 ...
[Web前端]
8个前沿的 HTML5 & CSS3 效果（附源码）
作为一个前沿的 Web 开发者，对于 HTML5 和 CSS3 技术或多或少都有掌握。前几年这些新技术刚萌芽的时候，开发者们已经使用它们来小试牛刀了，如今这些先进技术已经遍地开发，特别是在移动端大显身手。这篇文章挑选了8个前沿的 HTML5 & CSS3 效果，希望对你有所帮助。 1. HTML5 模拟现实物理效果 Ball Pool 是一个基于 HTML5 技术的实验，模拟现实物理效果 ...
[Web前端]
7 款震撼的 HTML5 动画应用及源码
今天我们精选了7款基于HTML5、Canvas以及CSS3的动画特效，同时也提供源代码，一起来看看吧。 1、HTML5 Canvas模拟衣服撕扯动画 这是一款基于HTML5 Canvas的模拟衣服撕扯动画，效果非常逼真。刚开始衣服挂在绳子上，用鼠标拖拽衣服即可让衣服摆动起来，当你拖拽的很用力时，你会发现，衣服被撕破了。该HTML5动画会捕获到鼠标拖拽的用力程度，从而来判断并实现衣服应该破损的程度 ...
[Web前端]
10 款很酷的 HTML5 动画应用
10款很酷的HTML5动画和实用应用，这里有菜单、SVG动画、Loading动画，总有你喜欢的，而且，每一款HTML5应用都提供源代码下载，方便大家学习和研究，一起来看看吧。 1、HTML5 SVG 树枝分叉动画特效 今天我们来分享一款基于HTML5和SVG的动画效果，它是一个可以自动分叉的树，动画将以二叉树的形式展开。这三颗SVG树先是用svg的g画笔来定义这些树枝，然后利用javascrip ...
[Web前端]
8 款实用的 jQuery/CSS3 应用插件
本文我们精选了最新8款经典实用的jQuery/CSS3应用插件，有按钮、菜单、图片等特效应用，欢迎收藏和分享。 1、jQuery滑过头像图片展示个人信息效果 这是一款经典的jQuery图片插件，同时，也可以是一款jQuery提示框插件。这款jQuery插件的功能是当你把鼠标滑过头像图片缩略图时，即可弹出头像对应用户的详细个人信息，弹出的标签虽然不大，但是还是能容纳很多个人信息的。 在线演示 ...