2013年10月12日
11个超炫的视差滚动网站欣赏
摘要： 目前这种视差滚动效果被越来越多的国内外网站所应用，成为网页设计的热点趋势。通过一个很长的网页页面，其中利用一些令人惊叹的插图 和图形，并使用视差滚动（Parallax Scrolling）效果，让多层背景以不同的速度移动，形成立体的运动效果，带来非常出色的视觉体验。完美的展示了一个复杂的过程，让你犹如置身其中。 厌倦了千篇一律，呆板网页设计的你不放一试。视差滚动效果与少即是多的理念相互交融，能带来清新炫目的感受，例如这组网站。Broken TwilltheQ cameraSrgintSojourn NetworkFall in TennesseeMade by BlockKill your D 阅读全文
posted @ 2013-10-12 08:31 Zimin 阅读(273) 评论(0) 推荐(0)
2013年10月11日
响应式设计的5个CSS实用技巧
摘要： 正如我在教程响应式Web设计三步走当中所讲的，响应式的 Web设计其实并不难，但是要让元素在布局切换时能够平滑过渡就比较考验技巧了。现在我分享在编码时常用的五个CSS技巧并举例说明。这些技巧都是使用简 单的CSS属性，如min-width、max-width、overflow 和相对属性值，但是这些属性在响应式设计中发挥着很大的作用。1. 响应式Video响应式video的CSS技巧是由tjkdesign.com发现的。我之前的一篇文章介绍过它，你可以在这里阅读。响应式视频会适应它的容器宽度。 1 .video { 2 position: relative; 3 padding... 阅读全文
posted @ 2013-10-11 08:40 Zimin 阅读(294) 评论(0) 推荐(0)
jquery获取浏览器高度、宽度和滚动条高度
摘要： 我们做前端的，经常需要获取浏览器的宽度和高度，还有滚动条的高度，今天整理出来，以后拿来直接用。Jquery代码： 1 alert($(window).height()); //浏览器时下窗口可视区域高度 2 alert($(document).height()); //浏览器时下窗口文档的高度 3 alert($(document.body).height());//浏览器时下窗口文档body的高度 4 alert($(document.body).outerHeight(true));//浏览器时下窗口文档body的总高度 包括border pad... 阅读全文
posted @ 2013-10-11 08:29 Zimin 阅读(537) 评论(0) 推荐(0)
2013年10月10日
jquery和其他库发生冲突的解决办法
摘要： 当我们在同一个页面下导入多个库文件的时候可能会发生冲突以致于网页报错而不能运行。比如前段时间我就做一个网页特效的时候引入了jquery和觉其他的库，最后网页发送冲突报错运行不了，但我把jquery库文件删除后就能正常运行了。平时我们在写jquery代码的时候都习惯用$，例如： $(function(){$("div").show() })如果没有用其他库这种写法是没问题的，如果用了其他库文件的话当其他库文件的全局对象也是$，问题就出来了。下面是几种解决的方法：一、用jQuery(callback)方法： jQuery(function(){jQuery("div& 阅读全文
posted @ 2013-10-10 22:23 Zimin 阅读(210) 评论(0) 推荐(0)
雅虎的14条性能优化原则
摘要： 法则1：减小HTTP请求次数 80%的最终用户响应时间花在前端程序上，而其大部分时间则花在各种页面元素，如图像、样式表、脚本和 Flash 等，的下载上。减少页面元素将会减少 HTTP 请求次数。这是快速显示页面的关键所在。一种减少页面元素个数的方法是简化页面设计。但是否存在其他方式，能做到既有丰富内容，又能获得快速响应时间呢？ 以下是这样一些技术： 1、Image maps 组合多个图片到一张图片中（CSS Sprites）。 2、Combined files 通过组合多个脚本文件到单一文件来减少 HTTP 请求次数。法则2：使用 CDN(Content Delivery ... 阅读全文
posted @ 2013-10-10 22:19 Zimin 阅读(336) 评论(0) 推荐(0)
手机网站前端开发布局技巧
摘要： 在 此所说的移动平台前端开发是指针对高端智能手机（如Iphone、Android）做站点适配也就是WebApp，并非是针对普通手机开发Wap 2.0，所以在阅读本篇文章以前，你需要对webkit内核的浏览器有一定的了解，你需要对HTML5和CSS3有一定的了解。如果你已经对此有所了解， 那现在就开始往下阅读吧……1、首先我们来看看webkit内核中的一些私有的meta标签，这些meta标签在开发webapp时起到非常重要的作用第一个meta标签表示：强制让文档的宽度与设备的宽度保持1:1，并且文档最大的宽度比例是1.0，且不允许用户点击屏幕放大浏览；第二个meta标签是iphone设备中的sa 阅读全文
posted @ 2013-10-10 22:10 Zimin 阅读(310) 评论(0) 推荐(0)
手机网站前端开发经验总结
摘要： 导读：国内手机网站目前还算是个新鲜事物，相应的手机网站前端开发也并不是特别成熟，对于一个网页设计师来说要做一个手机网站还是会碰到许多问题，本文转载自淘宝 UED，分享如何开发进行手机网站的前端卡发。从09年初接手淘宝手机网站前端开发的工作至今，转眼已是一年。一步步看着手机淘宝从最初的beta版本到今天的样子，感慨良多。手机网站开发，有着许多不为人知的困难：一是可参考的资料太少，大部分手机网站都处于起步阶段，很多的时候都是摸着石头过河，而鉴于淘宝自身的特殊性，也使得我们在参考成功案例之余，要做更多的思考；二是兼容性工作异常艰辛，难度一点也不比web网站的兼容性工作来的低；再 者作为一个手机网站的 阅读全文
posted @ 2013-10-10 22:06 Zimin 阅读(411) 评论(0) 推荐(0)
-webkit-scrollbar
摘要： -webkit-scrollbar在IE中可以自定义滚动条的样式 ，基于webkit的浏览器现在也可以自定义其样式：::-webkit-scrollbar { /* 1 */ } ::-webkit-scrollbar-button { /* 2 */ }::-webkit-scrollbar-track { /* 3 */ }::-webkit-scrollbar-track-piece{ /* 4 */ }::-webkit-scrollbar-thumb { /* 5 */ }::-webkit-scrollbar-corner { /* 6 */ }::-web... 阅读全文
posted @ 2013-10-10 22:01 Zimin 阅读(532) 评论(0) 推荐(0)
as3中TextFormat类的使用
摘要： 在AS3中对TextField进行格式化时可以有三种方法：html标签控制格式css使用TextFormathtml比较方便，但很有限，CSS可以外置维护比较容易，但缺少变化，TextFormat可以复杂多变，只是写起来比较麻烦，并且每次都要重新生成。OK，但有优缺，看着用吧。CSS和HTML就不多说了，这里讲下TextFormat类的内容，该类基本可以设置的内容有：font 字体名称 align 段落对齐方式size 文本大小 leftMargin 段落左边距color 文本颜色rightMargin 段落右边距bold 是否为粗体indent 段落的首行缩进italic 是否为斜体 blo 阅读全文
posted @ 2013-10-10 21:21 Zimin 阅读(655) 评论(0) 推荐(0)
flash全屏后的UI控制
摘要： 好多朋友对全屏后如何控制界面UI感到很困扰，可能你知道全屏是通过stage.displayState = StageDisplayState.FULL_SCREEN来实现的，其实我们还可以给stage添加Event.RESIZE事件，用来帮我们触发UI的定位与缩放。首先需要设置舞台对齐方式，这里设置对齐到左上角，也就是默认的坐标原点。接下来设置舞台的scaleMode，这里设置为NO_SCALE。stage.align = StageAlign.TOP_LEFT;stage.scaleMode = StageScaleMode.NO_SCALE;再初始化一个简单的播放器,这个例子只需要一个vi 阅读全文
posted @ 2013-10-10 21:18 Zimin 阅读(357) 评论(0) 推荐(0)