随笔分类 -  h5知识

上一页 1 2
提升html5的性能体验系列之三流畅下拉刷新
摘要：下拉刷新 为实现下拉刷新功能，大多H5框架都是通过DIV模拟下拉回弹动画，在低端android手机（Android4.4以下）上，DIV动画经常出现卡顿现象（特别是图文列表的情况）。解决方案还是webview。 既然拉div卡，那就不拉div，改拉webview。webview的拉动是原生的，回弹效 阅读全文
posted @ 2016-04-22 11:51 susanws 阅读(818) 评论(0) 推荐(0)
提升html5的性能体验系列之二列表流畅滑动
摘要：App的顶部一般有titlebar，下面是list。常见的一个需求是要在list滚动时，titlebar不动。这个简单的需求，实现起来其实并不简单。 在普通web上的做法是使用div的滚动条，把list放到div里。但是很不幸的是，div滚动条在Android4.4以下的手机上非常非常卡，滚动完全无 阅读全文
posted @ 2016-04-22 11:50 susanws 阅读(1415) 评论(0) 推荐(0)
提升html5的性能体验系列之一避免切页白屏
摘要：窗体切换白屏的现实问题 HTML5的性能比原生差很多，比如切页时白屏、列表滚动不流畅、下拉刷新和上拉翻页卡顿。在低端Android手机上，很多原生App常用的功能和体验效果都很难使用HTML5技术模拟。我们首先来看第一个问题，如何避免切页白屏。 浏览器的页面在切换时，由于其页面加载机制，在跳转到下一 阅读全文
posted @ 2016-04-22 11:49 susanws 阅读(2257) 评论(0) 推荐(0)
响应式布局简明示例
摘要：响应式布局简明示例，响应式布局最好同时也是自适应布局，然后再配合css3媒体查询，来达到完美的响应式布局。css3的媒体查询ie9一下是不支持的，这太遗憾了，不过幸运的是有大神已经为前端屌丝们写好了用于IE9以下的媒体查询脚本文件，引用方式如下：<!--[if lt IE 9]> <script s 阅读全文
posted @ 2016-04-22 11:19 susanws 阅读(151) 评论(0) 推荐(0)
完美解决ie8以下不兼容h5的方法
摘要：HTML5的语义化标签以及属性，可以让开发者非常方便地实现清晰的web页面布局，加上CSS3的效果渲染，快速建立丰富灵活的web页面显得非常简单。 HTML5的新标签元素有： <header>定义页面或区段的头部； <footer>定义页面或区段的尾部； <nav>定义页面或区段的导航区域； <se 阅读全文
posted @ 2016-04-20 11:52 susanws 阅读(17689) 评论(0) 推荐(0)
HTML5来了：5个好用的混合式App开发工具
摘要：在残酷的移动互联网竞争环境下， HTML5技术一直受到各方关注，“HTML5颠覆原生 App”的争论也从未停止过，不管怎样HTML5生态的构建方兴未艾。不过对于移动开发者来说更关心的问题是如何低成本、周期短开发出体验效果好的App，所以当下用HTML5远比赌HTML5更现实。于是，一个一直被提及但是 阅读全文
posted @ 2016-04-19 18:13 susanws 阅读(1762) 评论(0) 推荐(0)
深入浅出HTML与XHTML的区别
摘要：HTML（HyperText Markup Language，超文本标记语言）最早的HTML官方正式规范，是1995年IETF（Internet Engineering Task Force，因特网工程任务组）发布的HTML 2.0。W3C（World Wide Web Consortium，万维网 阅读全文
posted @ 2016-04-16 17:13 susanws 阅读(227) 评论(0) 推荐(0)
性能更好的js动画实现方式---requestAnimationFrame
摘要：用js来实现动画，我们一般是借助setTimeout或setInterval这两个函数，css3动画出来后，我们又可以使用css3来实现动画了，而且性能和流畅度也得到了很大的提升。但是css3动画还是有不少局限性，比如不是所有属性都能参与动画、动画缓动效果太少、无法完全控制动画过程等等。所以有的时候 阅读全文
posted @ 2016-04-14 12:57 susanws 阅读(258) 评论(0) 推荐(0)
Flex 布局教程：实例篇
摘要：上一篇文章介绍了Flex布局的语法，今天介绍常见布局的Flex写法。 你会看到，不管是什么布局，Flex往往都可以几行命令搞定。 我只列出代码，详细的语法解释请查阅《Flex布局教程：语法篇》。我的主要参考资料是Landon Schropp的文章和Solved by Flexbox。 一、骰子的布局 阅读全文
posted @ 2016-04-14 09:57 susanws 阅读(412) 评论(0) 推荐(0)
Flex 布局教程：语法篇
摘要：网页布局（layout）是CSS的一个重点应用。 布局的传统解决方案，基于盒状模型，依赖 display属性 + position属性 + float属性。它对于那些特殊布局非常不方便，比如，垂直居中就不容易实现。 2009年，W3C提出了一种新的方案 Flex布局，可以简便、完整、响应式地实现各种 阅读全文
posted @ 2016-04-14 09:55 susanws 阅读(157) 评论(0) 推荐(0)
教你用CSS代码写出的各种形状图形
摘要：做网页设计时经常要用到各种形状的图形，对于规则的图形很简单，但是对于不规则的图形，一般我们都是用图片，今天就在这里教大家怎样用css代码写出各种规则不同的图形 1.正方形 #square {width: 100px;height: 100px;background: red;} 2.长方形 #rec 阅读全文
posted @ 2016-04-13 16:24 susanws 阅读(881) 评论(0) 推荐(0)
最新最全的html5标签集合
摘要：最新最全的html5标签集合，按字母顺序排列的标签列表 4：指示在HTML4.01中定义了该元素 5：指示在HTML5中定义了该元素 阅读全文
posted @ 2016-04-13 16:18 susanws 阅读(333) 评论(0) 推荐(0)
详细的css命名规则，专业点吧
摘要：头：header内容：content/container尾：footer导航：nav侧栏：sidebar栏目：column页面外围控制整体布局宽度：wrapper左右中：left right center登录条：loginbar标志：logo广告：banner页面主体：main热点：hot新闻：ne 阅读全文
posted @ 2016-04-13 16:17 susanws 阅读(216) 评论(0) 推荐(0)
h5移动端设计页面
摘要：@京东设计中心 ：去年JDC出了不少优秀的武媚娘…不，H5呢，大家都很拼，同时当然也积累了一些经验和教训，今天结合咱们的实战案例，从字体，排版，动效，音效，适配性，想法这几个方面好好聊一聊关于H5的设计，希望对同学们有帮助。 字体 排版 在有限的手机屏幕空间内，我们积累的经验告诉我们最好的效果是简单 阅读全文
posted @ 2016-04-13 09:52 susanws 阅读(612) 评论(0) 推荐(0)

上一页 1 2