摘要: SMIL animation演示代码集锦 阅读全文
posted @ 2016-03-16 20:54 w3cape 阅读(214) 评论(0) 推荐(0) 编辑
摘要: SVG——可扩展适量图形,基于XML PC端:IE9+ wap端:表现良好,适合使用 基础图形: line(线段) <line x1="25" y1="150" x2="375" y2="50" stroke="#f00"></line> polyline(折线) <polyline points= 阅读全文
posted @ 2016-03-04 21:40 w3cape 阅读(446) 评论(0) 推荐(0) 编辑
摘要: 我们都知道,web开发中浏览器兼容性是困扰很多开发者的一个问题。所谓兼容性问题,即不同浏览器对同一段代码有不同的解析效果。而我们的需求往往是无论用户使用何种浏览器查看我们的网站,都应该获得相同或相近的体验。 浏览器兼容性问题主要分为HTML兼容问题(标签及其所属api的兼容问题)、css兼容问题、J 阅读全文
posted @ 2016-02-15 20:59 w3cape 阅读(189) 评论(0) 推荐(0) 编辑
摘要: 我们知道,css3通过border-radius、animation、transform等“新”特性可以绘制很多精致的图形。比如腾讯企鹅Logo、超能陆战队中的大白机器人、太阳系、小黄人、叮当猫、安卓机器人、苹果图标等等。 这些图形看似实现起来挺复杂,但它们通常都是由矩形、圆形、椭圆、三角、梯... 阅读全文
posted @ 2015-08-19 23:08 w3cape 阅读(597) 评论(0) 推荐(1) 编辑
摘要: 初识是第一次认识的意思,类似的词还有初见、初遇、初心、初愿、初恋、初吻……梦里相见如初识,很美好的感觉。同样,今天我们要认识的也是一个比较神奇美妙的东西,至少对于程序员来说。 我曾经尝试过很多文件加密的方式,因为每个人都有一些“小秘密”不愿被别人看见,大家都懂。直到认识了pngdrive,我知... 阅读全文
posted @ 2015-08-12 20:55 w3cape 阅读(313) 评论(0) 推荐(0) 编辑
摘要: 我们通常使用来实现网页中文件上传功能,用户可以通过点击file控件选择本地文件,当我们提交包含该控件的表单时,浏览器会向服务器发送用户选中的文件。 看上面的描述,file控件貌似挺强大的,事实上也是这样的。但实际开发中我们也可以挑出file控件的诸多问题: 1、我们可以通过value属性获取... 阅读全文
posted @ 2015-08-04 22:37 w3cape 阅读(355) 评论(0) 推荐(0) 编辑
摘要: tab页签通常适用于空间有限而内容较多同时兼顾页面美观度不给用户一种信息过量视觉疲劳的情形。使用面非常广,下面我们用两种方法简单实现之。 首先,构建页面元素。页签的可点击部分我们通常用列表来承载,包括ul和ol,我们这里让页签呈横向分布,所以需要使之向左浮动。而页签内容部分使用div承载即可。... 阅读全文
posted @ 2015-07-29 21:30 w3cape 阅读(1731) 评论(1) 推荐(0) 编辑
摘要: webp是谷歌10年发布的一种新的图片格式,支持有损压缩或无损压缩。据官方称无损压缩的webp在体积上要比png小26%,而有损压缩要比同质量jpg小25%~34%。经本人测试,由腾讯智图处理的不同图片转换webp压缩率不太一样,在24%~83%之间都有。这样大的压缩率对于我们Web前端开发工程... 阅读全文
posted @ 2015-07-22 21:11 w3cape 阅读(1213) 评论(0) 推荐(0) 编辑
摘要: 自Pinterest首次使用瀑布流式布局,现在这种页面布局已经得到了非常广泛的应用,比如蘑菇街、美丽说等各类购物网站,图丽网等美女图片展示网站等。现在我们扒一扒瀑布流的几种实现方式(今天在公司加班到10点才回,眼睛好累,代码先不写注解了,有时间再补上,感兴趣的同学可以自己敲着看看效果):一、cs... 阅读全文
posted @ 2015-07-15 23:43 w3cape 阅读(393) 评论(0) 推荐(0) 编辑
摘要: 继上篇讨论了一些关于JavaScript线程的知识,我们不妨回过头再看看,是不是JavaScript就不能多线程呢?看下面一段很简单的代码(演示用,没考虑兼容问题):代码判断一: click me执行之,不出意外的话所有浏览器都会卡死,因为上面的for循环次数太多了,非常耗费CPU资源,而... 阅读全文
posted @ 2015-07-08 21:44 w3cape 阅读(317) 评论(0) 推荐(0) 编辑