2013年07月_普通网友

原创 15个CSS3和jQuery的超棒页面过渡效果教程

日期：2013-7-31 来源：GBin1.comCSS3和jQuery从根本上改变了网页设计和程序开发。通过CSS3和jQuery，设计员和开发者不需要太多的精力或编码，就可以创造出非常美丽令人叹惊的效果，同时还可以令你快速完成任务。CSS3和jQuery最大的方便之处在于网上有大量的不同元素效果的展示教程，这一点使得学习新技巧和创造一些很棒的内容更加轻松。网上有很多页面过

2013-07-31 22:14:30 2088

原创来自极客标签10款最新设计素材-系列十二

日期：2013-7-29 来源：GBin1.com本周我们推荐来自极客标签社区带来的10款免费设计素材，大家可以在这里免费下载你需要的内容。如果你也有更好的作品，欢迎分享到社区中来，在得到帮助的同时，也能与更多人分享来自你的作品。天气相关的免费图标字体： Forecast Font一套和天气相关的字体图标，相信你会用的着的！迷你素材包1号这是一个系列

2013-07-30 13:35:37 821

原创 iOS7重磅推新--不断尝试与重新设计的过程

日期：2013-7-30 来源：GBin1.comiOS7重磅推新--不断尝试与重新设计的过程或许你心里已经有了关于iPhone最新操作系统的评价，可能你喜欢它，也可能不喜欢，事实上大多数设计者不喜欢。设计界似乎一致认为IOS 7的外观有些缺点。从极其丰富多彩的图标到不一致的文体，我敢肯定那些著名的软件用户界面设计师可以指出好几处可以改善的地方。IOS7应该是怎样的呢？一

2013-07-30 13:33:07 995

原创最好用的20个数据可视化工具（四）

日期：2013-7-26 来源：GBin1.com深入了解：本篇将介绍5种较高难度的可视化工具（或者你想查看前文）。如果你想做高水平的数据可视化，那么除了简单基于网页的工具，你还需要更有用的东西，包括桌面应用程序和编程环境。16、Processing Processing可谓是交互式可视化处理的模范工具，它能让你使用更简单的代码，再循序编译成Java。有一个叫做Process

2013-07-27 22:12:14 2331 1

原创最好用的20个数据可视化工具（三）

日期：2013-7-25 来源：GBin1.com在前两篇博文中，我们介绍过了10种可视化工具：最好用的20个数据可视化工具（一）最好用的20个数据可视化工具（二）本篇中我们将继续介绍5款可视化工具。11、Leaflet Leaflet是由 CloudMade 团队开发的一种微小的映射框架，小巧而轻便，用来创建移动页面。Leaflet和Modest Maps都是开源的

2013-07-25 12:22:26 2651

原创最好用的20个数据可视化工具（二）

日期：2013-7-24 来源：GBin1.com在上一篇最好用的20个可视化工具（一）中，我们介绍了5款数据可视化工具，这一篇中，我们将继续介绍另外5款可视化工具。6、D3D3（数据驱动文件）是另外一种支持SVG渲染的JavaScript库。不仅可以做简单的条形图和折线图，还可以完成更复杂的Voronoi图、树图、圆形集图和字符云。D3值得你拥有，但我不总是建议把D3当成转

2013-07-24 21:14:14 1546

原创最好用的20个数据可视化工具（一）

日期：2013-7-23 来源：GBin1.com从简单列表到复杂的地图或信息图表，Brian Suda工具集合了最好用的，几乎全部免费的数据处理工具供你使用。人们问我最多的问题，就是如何使数据可视化。通过以下介绍，加以练习，你就能理解如何使用这些工具了。在本篇文章中，我将介绍20种不同的数据可视化工具：从简单列表到复杂表格、地图和信息图表。这些工具都是免费的，甚至其中几种工具你可能已

2013-07-23 20:58:00 2547

原创如何简单快速的修改Bootstrap

日期：2013-7-22 来源：GBin1.comBootstrap并不是单单意味着HTML/CSS界面框架，更确切的说，它改变了整个游戏规则。这个囊括了应有尽有的代码框架使得许多应用和网站的设计开发变得简便许多，而且它将大量的HTML框架普及成了产品。可悲的是，它纯粹的功能唤起了我们本能的懒惰，很多人始终坚持使用它的默认设置。现在，你要知道，这些经过丰富想象力的默认样式和布局网格都

2013-07-22 13:02:05 1211

原创智能手机移动应用的8个趋势

日期：2013-7-18 来源：GBin1.com如果说智能手机和智能设备现在被认为是个人和办公方面的科技标准，那么这种描述就过于简单了。几乎没有人能否认一个事实，就是每个人都需要这种智能技术。尽管每个人拥有智能手机或其他智能设备的理由不尽相同，但它是必须的。无论从个人或者商务的角度看，智能科技已经成为我们生活的一部分。现在，智能科技无处不在，开发商不得不为智能手机用户设计出更加方

2013-07-18 17:31:19 735

原创来自极客标签10款最新设计素材-系列十一

日期：2013-7-17 来源：GBin1.com本周我们推荐来自极客标签社区带来的10款免费设计素材，大家可以在这里免费下载你需要的内容。如果你也有更好的作品，欢迎分享到社区中来，在得到帮助的同时，也能与更多人分享来自你的作品。 iPad和iPhone 5的免费线框设计来自Cat Smith的一套免费的ipad和iphone的线框设计，包含了相关PSD文件。令人印象深刻

2013-07-17 18:52:59 708

原创 CSS3实现的图片加载动画效果

日期：2013-7-16 来源：GBin1.com在线演示使用CSS3实现的不同图片加载动画效果，支持响应式，非常适合针对瀑布流布局图片动态加载特效进行增强！HTML CSS3 /* Effect 4: fall perspective */ .grid.effect-4 {

2013-07-17 07:11:09 2271 1

原创推荐十款来自极客标签的超棒前端特效[第十期]

日期：2013-7-15 来源：GBin1.com本周，我们带来了极客社区推荐的10款前端特效，仍然是非常有趣的小动态效果的页面生成。喜欢的可以直接将我们的在线调试代码插入，希望可以带给大家一些更好的帮助和不同以往的更好的体验！旋转效果的加载测试这是一款使用CSS实现的加载测试页面，大家可以根据下方地址找到在线调试界面，直接获取代码！GBdebug在线调试地址：http://

2013-07-15 18:34:59 958

原创超酷的实时颜色数据跟踪javascript类库 - Tracking.js

日期：2013-7-13 来源：GBin1.com今天介绍这款超棒的Javascript类库是 - Tracking.js，它能够独立不依赖第三方类库帮助开发人员动态跟踪摄像头输出相关数据。这些数据包括了颜色或者是人，这意味着你可以通过特定的颜色或者人物的移动或者脸部来触发javascript事件。相信如果接触过Kinect或者Wii的朋友肯定能够使用这个类库开发出类似的体感

2013-07-13 21:09:10 682

原创使用HTML5画布（canvas）生成阴影效果

日期：2013-7-12 来源：GBin1.com使用HTML5的画布特性，我们可以创建图形，在这片文章中，我们将创建图形的阴影。 var canvas = document.getElementById('shadowcanvas'); var ctx = canvas.getContext('2d'); ctx.save(); ctx.fillStyle =

2013-07-12 13:37:27 1218

原创推荐八款来自极客标签的超棒前端特效[第九期]

日期：2013-7-11 来源：GBin1.com本周，我们带来了极客社区推荐的10款前端特效，仍然是非常有趣的小动态效果的页面生成。喜欢的可以直接将我们的在线调试代码插入，希望可以带给大家一些更好的帮助和不同以往的更好的体验！使用CSS来实现三维步行机器人效果这是一款使用CSS来制作的效果，运行代码你将看到360旋转的机器人行走特效！注意，请使用Firefox浏览！GB

2013-07-11 08:08:20 854

原创分享10个超实用的jQuery代码片段

日期：2013-7-9 来源：GBin1.comjQuery以其强大的功能和简单的使用成为了前端开发者最喜欢的JS类库，在这里我们分享一组实用的jQuery代码片段，希望大家喜欢！jQuery平滑回到顶端效果$(document).ready(function() { $("a.topLink").click(function() { $("html, body").

2013-07-09 23:02:40 725

原创前端性能优化：使用媒体查询加载指定大小的背景图片

日期：2013-7-8 来源：GBin1.com直到CSS @supports被广泛支持，CSS媒体查询的使用接近于CSS中写逻辑控制。我们经常用CSS媒体查询来根据设备调整CSS属性（通常根据屏幕宽度调整CSS属性），例如根据不同的屏幕宽度来设置不同的元素宽度或者是悬浮位置。那么我们为什么不用这种方式来改变背景图片呢？/* 默认是为桌面应用加载图片 */.someEleme

2013-07-08 19:42:41 1251

原创前端性能优化：使用Data URI代替图片SRC

日期：2013-7-6 来源：GBin1.com提升页面大小的效率，不仅仅是取决于使用精灵或是压缩代码，给定页面的请求数量在前端性能中也占有了很不小的重量。减少请求可以让你的网站加载更快，而其中一种减少页面请求的方法就是用Data URI代替图片的src属性：当然页面大小会增加（如果你的服务器使用适当的gzip内容，这个增加会很小），但是你减少了潜在的请求，同时也在

2013-07-07 18:58:33 964

原创前端性能优化：使用事件委托

日期：2013-7-5 来源：GBin1.com想象一下，如果你有一个无序列表，里面有一堆元素，每一个元素都会在点击的时候触发一个行为。这个时候，你通常会在每一个元素上添加一个事件监听，但是如果当这个元素或者你添加了监听的这个对象会被频繁的移除添加呢？这个时候，你在移除添加元素的同时需要处理事件监听的移除和添加。这个时候，我们就需要引入事件委托了。事件委托是在父级元素上添加一个事

2013-07-05 12:47:55 986

原创前端性能优化：尽可能使用CSS动画

日期：2013-7-4 来源：GBin1.com网站设计对美观特性和可配置元素动画的大量需求，使得一些JavaScript类库，如jQuery，MooTools大量的被使用。尽管现在浏览器支持CSS的transformation和keyframe所做的动画，现在仍有很多人使用JavaScript制作动画效果，但是实际上使用CSS动画比起JavaScript驱动的动画效率更高。CSS动画同

2013-07-04 17:15:22 1006 1

原创前端性能优化：使用Array.prototype.join代替字符串连接

日期：2013-7-3 来源：GBin1.com有一种非常简单的客户端优化方式，就是用Array.prototype.join代替原有的基本的字符连接的写法。在这个系列的第一篇中，我在代码中使用了基本字符连接：htmlStr += '' + item.text + '';但是下面这段代码中，我用了优化：var items = [];ajaxResult.items.

2013-07-03 09:47:23 673

原创前端开发攻城师绝对不可忽视的五个HTML5新特性

日期：2013-7-2 来源：GBin1.comHTML5已经火了一段时间了，相信作为web相关开发工程师，肯定或多或少的了解和尝试过一些HTML5的特性和编程。还记得以前我们介绍过的HTML5新标签。作为未来前端开发技术的潮流和风向标，HTML5绝对不容忽视。在今天这篇技术分享文章中，我们将介绍几个HTML5的重要特性，能够帮助你提高整个web应用的使用体验和开发效率，相

2013-07-02 09:34:45 1066

原创 2013年六月GBin1月刊

2013年六月GBin1月刊超酷的图片标题悬浮特效在这一套前端特效欣赏中，我们介绍来自tympanus的一套超酷的图片标题悬浮特效，你可以使用这种方式更加有效的介绍或者说明图片的相关内容和信息。阅读更多在线帮助你修改图片背景的工具 - Clipping Magic如果你是美工或者前台设计师的话，肯定需要常常处理透明背景图片的问题。今天这里我们介绍的这款web在线工具

2013-07-02 09:30:45 1270

原创前端性能优化：使用异步加载，延迟加载依赖

日期：2013-7-1 来源：GBin1.comRequireJS已经迎来了异步加载和AMD格式的巨大浪潮。XMLHttpRequest(该对象可以调用AJAX)使得资源的异步加载变得流行起来，它允许无阻塞资源加载，并且使 onload 启动更快，允许页面内容加载，而不需要刷新页面。我所用的异步加载器是John Hann的curl。curl加载器是基本的异步加载器，可以被配置，拥

2013-07-01 10:01:39 1166

原创超酷的图片标题悬浮特效

日期：2013-6-30 来源：GBin1.com在线演示在这一套前端特效欣赏中，我们介绍来自tympanus的一套超酷的图片标题悬浮特效，你可以使用这种方式更加有效的介绍或者说明图片的相关内容和信息。因为使用CSS3，请使用现代浏览器运行在线演示。来源：http://tympanus.net/codrops/2013/06/18/caption-hove

2013-07-01 09:57:27 756

原创 JQuery插件：动态列和无间隙网格布局Mason.js

日期：2013-6-29 来源：GBin1.com在线演示JavaScript提供很多强有力的方案，解决动态列的网格布局（例如：Pinterest）。这些方案很有效，但是，有时候，会造成网格的间隙或粗糙的边缘。 Mason.js是一个jQuery插件，巧妙地填充了这些间隙。当创建一个网格时候，插件就开始计算这些间隙，然后就使用预定义的元素或是在网格中复制的内容来填充这些间隙。

2013-07-01 09:51:49 965

GBin1.com