![](https://img-blog.csdnimg.cn/20201014180756757.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
HTML5
lishengko
这个作者很懒,什么都没留下…
展开
-
HTML5简介及新特性
HTML5简单理解就是在HTML的基础上加了一些新标准,新标签,本地化存储,移动端适配优秀,动画特效实现简洁(不依赖JS,纯DIV+CSS3.0),可直接对文件操作(图片压缩,浏览)。HTML5常用新特性:1.新标签 HTML5的新标签大致可分为两类。第一类是布局标签,第二类是独立标签。 布局标签:如header,footer标签替换div标签实现网页的页眉页脚布局。```<header>页眉</h原创 2017-02-16 18:40:36 · 1617 阅读 · 0 评论 -
HTML5移动端图片浏览上传
HTML5移动端图片浏览上传HTML页面中图片底层是base64格式字符串显示的,HTML5中可以直接操作base64字符,完成图片的浏览压缩等,比后台图片压缩效率高,速度快,但占用的是客服端资源。 PHP,Java,.Net都用相应语法把base64转成二进制在转换成对应文件。图片上传的时候原创 2017-02-18 17:31:24 · 829 阅读 · 0 评论 -
HTML5移动端触摸屏图片轮播滑动
HTML5移动端触摸屏图片轮播滑动JS_touch介绍 touchstart:当手指触摸屏幕时触发;即使已经有一个手指放在了屏幕上也会触发。 touchmove:当手指在屏幕上滑动时连续的触发。在这个事件发生期间,调用preventDefault()可阻止滚动。 touchend:当手指从屏幕上移开时触发。原创 2017-02-18 15:23:24 · 8288 阅读 · 2 评论 -
HTML5滑动门动画(侧滑,上滑)
HTML5的动画是通过伪类@实现的,设置动画的起始位置,结束位置,动画时间即可,中间的过度HTML会自动补齐,简单的代码就可以实现炫酷动画效果。 实例: <!DOCTYPE html><html><head> <meta charset="utf-8"> <title>动画</title> <style type="text/css"> .animat原创 2017-02-17 17:15:54 · 4450 阅读 · 0 评论 -
HTML5canvas实现柱型动画报表
canvas为HTML5的核心标签,可以实现任意图形的绘画,并可通过算法将绘画变成炫酷的动画效果,类似程序开发中的画布,画笔,填充等。基础图形为矩形和圆形,直线,抛物线,在根据相关算法便可画出所需图形,但对程序员的数学和逻辑性要求较高。所有的图形底层都是点,线实现的,只是不同的语言封装好了相关的实现类而已。 基础语法我就不介绍了,实例如下:<!DOCTYPE html><html><head>原创 2017-02-17 13:17:00 · 910 阅读 · 0 评论 -
HTML5网页页面无刷新更新页面URL
HTML5网页页面无刷新更新URLHTML5可通过history.pushState修改网页的URL地址,在配合相关代码显示隐藏相应界面便可以实现单页面多界面相互操作。该方法比直接访问URL地址速度快,执行效率高,UI体验好,但会增加页面的复杂性及耦合性,要视实际情况而定,一般都用在dialog弹出框上。 实例:原创 2017-02-18 18:16:53 · 3797 阅读 · 0 评论 -
HTML53D动画效果实现原理及实例
动画中的3D效果其实就是2D平面图的切割,旋转。一张A4纸折成圆柱体,转起来就是所谓的3D效果。 首先将2D平面图平铺分割成若干个横截面,将分割后的横截面旋转起来就实现了3D效果,核心语法transform: rotateY translateZ translateY。 分割的横截面越多,动画过度越流畅,占内存越大,具体可根据实际情况而定。 实例地址:http://fff.cmiscm.com原创 2017-02-27 11:04:53 · 3073 阅读 · 0 评论