HTML5
weistar103
这个作者很懒,什么都没留下…
展开
-
javascript的getComputedStyle方法获取节点的计算后的CSS样式
今天在做东西的时候,遇到一个问题:想获取节点style指定的CSS属性,如:ele.style.display属性,如果在节点中没有设置其style.display属性的话则通过ele.style.display这种方式获取的值为空字符串。 如果节点ele是一个块状元素的话,通过上述方式返回的display的值则应该为:block的,而其得到的值为空字符串并非我想得到的,在网...原创 2014-09-12 18:04:02 · 186 阅读 · 0 评论 -
HTML5 Tutorial: How to Get and Set a Base64 Image on Canvas using toDataURL
文章源自:http://simeonvisser.hubpages.com/hub/HTML5-Tutorial-How-To-Use-Canvas-toDataURLHTML5 Tutorial: How to Get and Set a Base64 Image on Canvas using toDataURLFor many web applications it can...原创 2013-07-30 13:42:51 · 159 阅读 · 0 评论 -
CSS中!important的作用--浏览器兼容性
{*rule !important}这个css规则当今在网页制作的时候的普及已经非常流行了,以前我对它的理解就停留在‘浏览器是否识别阶段’ 而没有真正去研究过,可是现在发生了变化。众所周知,!important这个规则对Ie6.0,Ie7.0和Firefox能写hack,现在就来讲解 这是什么原理: *对于Ie系列浏览器都能够识别, firefox 浏览器则不能识别; !import...原创 2013-12-25 09:26:01 · 1406 阅读 · 0 评论 -
超级有用的CSS编码工具集
文章源自:http://www.csdn.net/article/2013-07-16/2816248-css-coding超级有用的CSS编码工具集当你在开发某个网站或者应用时,找到适宜的工具绝对能帮助您节省大量的时间,本文,笔者收集了九款超级有用的CSS编码工具,借助这些优秀的工具能大大地减少开发时间,加快开发进度。 Pure CSS Pure是CSS模块的组件,你可...原创 2013-07-18 17:04:13 · 81 阅读 · 0 评论 -
IE8缩放Bug
工作中遇到页在精确布局,使用js+css方式实现,支持浏览器包括:ie8+,firefox,chrome,結果变态的测试使用各种放大/缩小页面的测试,导致布局问题,现一点点完善中。。。今天发现一个ie8兼容性问题:若使用css百分比定义html,body的宽高,会导致页面缩放时不触发onresize事件,具体代码如下:<!doctype html><html>...原创 2013-11-05 17:37:24 · 222 阅读 · 0 评论 -
Web开发者不容错过的20段CSS代码
文章源自:http://www.csdn.net/article/2013-05-24/2815422-20-Useful-CSS-Snippets-Every-Designer-Should-HaveWeb开发者不容错过的20段CSS代码Web开发技术每年都在革新,浏览器已逐渐支持CSS3特性,并且网站设计师和前端开发者普遍采用这种新技术进行设计与开发。但仍然有一些开发者迷恋着一些C...原创 2013-05-29 20:37:09 · 73 阅读 · 0 评论 -
利用 FormData 对象发送 Key/Value 对的异步请求
文章源自:http://www.oschina.net/translate/using-formdata-to-send-forms-with-xhr-as-keyvalue-pairs?cmp 利用 FormData 对象发送 Key/Value 对的异步请求使用Key/Value对和FormData能够轻易地通过XMLHttpRequest指定要传递什么数据,它是一个非常强大的...原创 2013-05-14 16:34:15 · 173 阅读 · 0 评论 -
《金融时报》是如何做Web App离线功能的?
文章源自:http://www.angularjs.cn/A02Y 我曾在《让Web App和Native App的无聊之争消停会儿吧,看看那些明智的Web技术解决方案》中讲到过第一个选择纯粹Web App路 线的主流新闻媒体——Financial Times(金融时报)。FT产品主管曾说过,开发Web面临几个主要挑战:1. 目前Web App领域的开发文档、测试工具都很稀缺,需要自己开...原创 2013-05-06 16:54:17 · 162 阅读 · 0 评论 -
AngularJs--Dependency Injection(DI,依赖注入)
文章源自:http://www.cnblogs.com/lcllao/archive/2012/09/23/2699401.html 一、Dependency Injection(依赖注入) 依赖注入(DI)是一个软件设计模式,处理代码如何得到它所依赖的资源。 关于DI更深层次的讨论,可以参观Dependency Injection(http://en.wikiped...原创 2013-05-06 15:08:00 · 94 阅读 · 0 评论 -
JavaScript MVC框架PK:Angular、Backbone、CanJS与Ember
文章来源:http://www.csdn.net/article/2013-04-25/2815032-A-Comparison-of-Angular-Backbone-CanJS-and-Ember选择JavaScript MVC框架很难。一方面要考虑的因素非常多,另一方面这种框架也非常多,而要从中选择一个合适的,还真得费一番心思。想知道有哪些JavaScript MVC框架可以选择?看...原创 2013-05-06 11:10:23 · 94 阅读 · 0 评论 -
HTML5 Canvas中实现文字链接
文章源自:http://blog.csdn.net/yorhomwang/article/details/9625319 HTML5中没有关于链接的API,所以我们只有自己来实现了。首先,我们来想一下,链接有什么特点。第一个想到的估计就是它能跳转,这是链接最显著的特点,当然这也是废话,要不怎么能叫链接?第二个想到的可能 就是文字下方的下划线;第三可能就是当鼠标盘旋在它上空时,鼠标要...原创 2013-08-09 10:17:57 · 162 阅读 · 0 评论 -
Html5实现iPhone开机界面
文章源自:http://blog.csdn.net/yorhomwang/article/details/9205201由于lufylegend封装得的确不错,本次开发还是用该引擎做的。代码不多,感兴趣的朋友可以直接看一下。index.html中的代码:<!DOCTYPE html><html><head> <meta chars...原创 2013-08-09 13:59:56 · 174 阅读 · 0 评论 -
移动端性能大比拼:CSS Sprites vs. Data URI
文章源自:http://www.csdn.net/article/2013-09-13/2816925-CSS-Sprites-vs.-Data-URIs:-Which-is-Faster-on-Mobile?移动端性能大比拼:CSS Sprites vs. Data URI本文是作者调查Data URI在移动端性能表现的第三篇文章,第一二篇分别是:在移动平台上,Data URI要比原...原创 2013-09-27 11:29:15 · 109 阅读 · 0 评论 -
document的createDocumentFragment()方法
文章源自:http://www.cnblogs.com/yunfour/archive/2011/06/21/2085911.html 在《javascript高级程序设计》一书的6.3.5:创建和操作节点一节中,介绍了几种动态创建html节点的方法,其中有以下几种常见方法:· crateAttribute(name): 用指定名称name创建特性节点· creat...原创 2014-09-12 17:28:17 · 123 阅读 · 0 评论 -
如何生成一个CSS的三角形
文章源自:http://www.gbtags.com/gb/share/2094.htm如何生成一个CSS的三角形直接运行代码,查看制作效果。<!Doctype html><html><head><meta charset="utf-8"><title>小三角</title>&l原创 2013-11-01 14:07:41 · 100 阅读 · 0 评论 -
绝对应当收藏的HTML5代码片段
文章源自:http://www.gbtags.com/gb/share/2268.htm绝对应当收藏的HTML5代码片段HTML5的最简单模板如果你需要开始一个新的HTML5项目的话,大家肯定会需要一个最简单的模板,这里是一个非常简单并且清晰的HTML5模板,相信大家会喜欢!<!DOCTYPE html><html><head> ...原创 2013-11-01 11:40:54 · 138 阅读 · 0 评论 -
7个实用的Mobile移动相关HTML、CSS、JavaScript代码片段
文章源自:http://www.gbtags.com/gb/share/2046.htm7个实用的Mobile移动相关HTML、CSS、JavaScript代码片段 移动HTML,CSS和JavaScript开发兴起若干年,如果你是这方面的开发者,肯定积攒了一些很棒的代码片段。可能有些已应用到程序开发中,有些可能可以保存到未来实用。在下面的文章中我将推荐7段非常实用的代码片段,或许可以...原创 2013-11-01 11:19:33 · 147 阅读 · 0 评论 -
利用CSS、JavaScript及Ajax实现图片预加载的三大方法
文章源自:http://www.csdn.net/article/2013-10-15/2817187-3-ways-preload-images-css-javascript-ajax利用CSS、JavaScript及Ajax实现图片预加载的三大方法预加载图片是提高用户体验的一个很好方法。图片预先加载到浏览器中,访问者便可顺利地在你的网站上冲浪,并享受到极快的加载速度。这对图片画廊及...原创 2013-10-17 15:13:45 · 79 阅读 · 0 评论 -
table的css样式
非常好的Table样式,看代码吧<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml">&...原创 2013-10-16 17:49:49 · 89 阅读 · 0 评论 -
用jQuery Mobile创建Web App
文章源自:http://www.csdn.net/article/2013-10-11/2817152-mobile-app-navigation-with-jquery手把手教学,用jQuery Mobile创建Web App移动互联网的发展,促生了各种各样的移动Web框架。jQuery是继Prototype之后又一个优秀的JavaScript框架。通过jQuery, 我们能够快速地...原创 2013-10-14 18:09:53 · 179 阅读 · 0 评论 -
技术开发者如何看实时Web App开发框架?
文章源自:http://www.csdn.net/article/2013-09-29/2817091-how-do-developers-like-web-app-framework技术开发者如何看实时Web App开发框架?2013年9月26日,由CSDN承办的以“Clouda开源技术框架,引领实时App时代”为主题的 百度Clouda开发者沙龙在北京车库咖啡举行。本次活动主要针对 ...原创 2013-10-08 17:34:43 · 135 阅读 · 0 评论 -
IndexedDB:浏览器里内置的数据库
文章源自:http://www.webhek.com/indexeddb IndexedDB是HTML5规范里新出现的浏览器里内置的数据库。对于在浏览器里存储数据,你可以使用cookies或local storage,但它们都是比较简单的技术,而IndexedDB提供了类似数据库风格的数据存储和使用方式。存储在IndexedDB里的数据是永久保存,不像cookies那样只是临时的。In...原创 2015-02-25 16:44:37 · 125 阅读 · 0 评论 -
如何组织大型JavaScript应用中的代码?
文章源自:http://www.csdn.net/article/2013-04-27/2815077-code-organization-angularjs-javascript本文作者Cliff Meyers是一个前端工程师,熟悉HTML5、JavaScript、J2EE开发,他在开发过程中总结了自己在应对JavaScript应用越来越庞大情况下的文件结构,深得其他开发者认可。以下为C...原创 2013-05-06 11:10:00 · 69 阅读 · 0 评论 -
PhoneGap API帮助文档翻译—Storage(存储)
文章源自:http://blog.csdn.net/phonegapcn/article/details/6702943提供对设备的存储选项的访问。此 API基于W3C WEB SQL Database Specification和W3C Web Storage API Specification。有些设备已经提供了对该规范的实现,对于这些设备采用内置实现而非使用PhoneGap的实现...原创 2013-05-05 11:49:34 · 102 阅读 · 0 评论 -
PhoneGap API帮助文档翻译—Notification(提醒)
文章源自:http://blog.csdn.net/phonegapcn/article/details/6702923设备的视觉、听觉和触觉通知。方法:notification.alertnotification.confirmnotification.beepnotification.vibratenotification.alert显示一个定制的警告或...原创 2013-05-05 11:48:47 · 69 阅读 · 0 评论 -
window.onpopstate
文章来自:https://developer.mozilla.org/zh-CN/docs/DOM/window.onpopstate适用于 Gecko 2 以上(Firefox 4 / Thunderbird 3.3 / SeaMonkey 2.1) 概述window.onpopstate是popstate事件在window对象上的事件句柄.每当处于激活状态的历史记录...原创 2013-04-27 17:51:13 · 223 阅读 · 0 评论 -
操纵浏览器的历史记录
文章来自:https://developer.mozilla.org/zh-CN/docs/DOM/Manipulating_the_browser_history window 对象通过history对象提供对览器历史记录的访问能力。它暴露了一些非常有用的方法和属性,让你在历史记录中自由前进和后退,而在HTML5中,更可以操纵历史记录中的数据。 历史记录概览 可以通过back...原创 2013-04-27 17:36:07 · 617 阅读 · 0 评论 -
使用JavaScript进行iframe的DOM操作
使用JavaScript可以方便的进行iframe的DOM操作若是在本地测试,可直接使用IE和FireFox,使用chrome则需要执行chrome --disable-web-security禁用chrome的WEB安全限制则可以在本地进行测试,代码如下:iframe_dom.html<!DOCTYPE html"><html> <hea...原创 2013-04-10 19:12:01 · 234 阅读 · 0 评论 -
利用HTML5的window.postMessage实现跨域通信
文章来源:http://www.36ria.com/3890 由于同源策略的限制,JavaScript跨域的问题,一直是一个颇为棘手的问题,为了解决js的跨域,web开发人员是煞费苦心,研究了各种跨域方案,如果有机会的话,明河以后会一一展示给各位,今天明河重点介绍下html5新引入的postMessage跨域方案。 1.哪些场景要考虑跨域问题?明河这二周在处理淘宝添加收藏夹的...原创 2013-04-10 18:21:16 · 149 阅读 · 0 评论 -
Mobile Web开发基础————处理设备的横竖屏
文章来自:http://blessdyb.iteye.com/blog/1537076为了应对移动设备屏幕的碎片化,我们在开发Mobile Web应用时,一个最佳实践就是采用流式布局,保证最大可能地利用有限的屏幕空间。由于屏幕存在着方向性,用户在切换了屏幕的方向后,有些设计上或实现上的问题就会凸显——我们至少需要处理一下当前显示元素的宽度的适配(当然,要做的可能不仅仅是这个)。很多时候,我...原创 2013-04-02 15:44:24 · 141 阅读 · 0 评论 -
Mobile Web开发基础————按钮
文章来自:http://blessdyb.iteye.com/blog/1534285按钮是天生为移动平台而生的:移动平台上的按钮往往被设计得比较大以便用户点击——与此形成鲜明对比的就是移动平台上的超链接。移动平台与桌面平台在人机交互上有显著的不同,移动平台的输入工具为用户的手指,显示区域相对输入工具就很小;而对于桌面平台,显示区域较输入区域就大得多了,鼠标的存在,更是与触屏式的交互有所不同...原创 2013-04-02 13:41:26 · 86 阅读 · 0 评论 -
Mobile Web开发基础————viewport标签
文章来自:http://blessdyb.iteye.com/blog/1534051我们先来一个基础的HTML5的网页框架,如下:<!Doctype html> <html> <head> <meta charset="utf-8"> <title>基本HTML5...原创 2013-04-02 09:51:17 · 96 阅读 · 0 评论 -
scrollLeft、offsetLeft、clientLeft、clientHeight详解
最近开始写HTML5应用,需要补充一下DIV知识. scrollHeight: 获取对象的滚动高度,对象的实际高度;scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离scrollWidth:获取对象的滚动宽度offsetHeight:获取对象相对由父坐标 offsetParent ...原创 2013-03-26 15:08:47 · 89 阅读 · 0 评论 -
cordova-mobile数据库开发参考
使用apache-cordova开发HTML5应用,操作数据库参考如下: <!DOCTYPE html><!--Licensed to the Apache Software Foundation (ASF) under oneor more contributor license agreements. See the NOTICE filedis...原创 2013-03-18 16:07:56 · 169 阅读 · 0 评论 -
cordova for android 如何在App中响应退出按钮
前言:采用phonegap/cordova开发的WebApp,如果用户点击退出按钮,则App会直接退出。下面的代码可以响应后退按钮,并提示用户再次点击才退出。如果3秒后没有点击则重新注册事件。注意:window.plugins.ToastPlugin.show_short()是显示toast消息的插件!代码:// 等待加载PhoneGapdocument.addEventListener("dev...原创 2013-05-02 10:36:43 · 228 阅读 · 0 评论 -
PhoneGap API帮助文档翻译—Accelerometer (加速度计)
采集设备在x、y、z方向上的动作。 方法: accelerometer.getCurrentAccelerationaccelerometer.watchAccelerationaccelerometer.clearWatch参数: accelerometerSuccessaccelerometerErroraccelerometerOptions...原创 2013-05-02 11:25:42 · 118 阅读 · 0 评论 -
PhoneGap API帮助文档翻译—Camera (摄像头)
camera对象提供对设备默认摄像头应用程序的访问。方法: camera.getPicture 参数: cameraSuccesscameraErrorcameraOptionscamera.getPicture:选择使用摄像头拍照,或从设备相册中获取一张照片。图片以base64编码的字符串或图片URI形式返回。简单的范例: navigat...原创 2013-05-02 13:57:13 · 73 阅读 · 0 评论 -
PhoneGap API帮助文档翻译—Media(媒体)
文章源自:http://blog.csdn.net/phonegapcn/article/details/6702883Media对象提供录制和回放设备上的音频文件的能力。 var media = new Media(src, mediaSuccess, [mediaError]); 备注:Media的当前实现并没有遵守W3C媒体捕获的相关规范,目前只是为了提供方...原创 2013-05-05 11:48:05 · 80 阅读 · 0 评论 -
PhoneGap API帮助文档翻译—Geolocation(地理位置)
文章源自:http://blog.csdn.net/phonegapcn/article/details/6702864geolocation对象提供了对设备GPS传感器的访问。Geolocation提供设备的位置信息,例如经度和纬度。位置信息的常见来源包括全球定位系统(GPS),以及通过诸如IP地址、RFID、WiFi和蓝牙的MAC地址、和GSM/CDMA手机ID的网络信号所做的...原创 2013-05-05 11:47:22 · 96 阅读 · 0 评论 -
PhoneGap API帮助文档翻译—File(文件)
文章源自:http://blog.csdn.net/phonegapcn/article/details/6702509用于读取、写入和浏览文件系统层次结构的API。对象:DirectoryEntryDirectoryReaderFileFileEntryFileErrorFileReaderFileSystemFileTransferFileTra...原创 2013-05-03 12:52:35 · 191 阅读 · 0 评论