CSS3响应式滑动菜单
摘要:

今天我们要来分享一款基于CSS3的响应式滑动菜单,该菜单有两个特点:1.响应式布局,这就意味着随着页面大小的变化,菜单的布局也会发生自适应变化,特别适合在移动设备上使用。2.鼠标滑过动画,鼠标滑过菜单项时可以渐变滑动,动画效果还不错。
阅读全文
posted @
2015-08-05 19:43
html5前端技术分享
阅读(2813)
推荐(0) 编辑
超炫酷的jQuery轮播焦点图 底部带切换缩略图
摘要:

前面我们刚刚分享过一款jQuery/HTML5响应式焦点图动画应用,效果非常炫酷。这次我们再来分享一款基于jQuery的图片轮播焦点图,这款jQuery焦点图的特点是整个图片播放器是宽屏的效果,并且在焦点图底部有一排可以滑动的缩略图,点击缩略图可以快速跳转到相应的图片。
阅读全文
posted @
2015-08-05 19:41
html5前端技术分享
阅读(1059)
推荐(0) 编辑
jQuery/HTML5响应式焦点图动画应用
摘要:

之前我们分享过不少基于jQuery和HTML5的焦点图动画了,比如这里10款精美实用的jQuery焦点图动画推荐就有不少收集的jQuery焦点图插件,效果非常棒。今天要继续为大家介绍一款jQuery/HTML5响应式焦点图动画插件,它的响应式特性可以让焦点图在移动设备上也有不错的效果。
阅读全文
posted @
2015-08-05 19:36
html5前端技术分享
阅读(738)
推荐(1) 编辑
jQuery 3D 女神图片墙 可旋转播放
摘要:

还记得之前分享过一款HTML5 3D立体图片相册,相册中的美女图片非常有特色。今天我们又要来分享一款可旋转播放的jQuery 3D女神图片墙,和一般的图片播放器不同的是,这款图片播放器是3D环形的,图片展示也将随着环形来回切换,效果非常不错。
阅读全文
posted @
2015-08-05 19:34
html5前端技术分享
阅读(1379)
推荐(0) 编辑
HTML5 Canvas雨滴下落动画 超逼真
摘要:

今天我们要来分享一款相当逼真的HTML5 Canvas雨滴下落动画,该动画模拟雨滴附在窗户上缓缓滑落的效果,同时窗户也因为雨滴而变得模糊,窗外的夜景便显得格外迷人。利用HTML5技术,该雨滴下落动画一共有5种不同的效果。由于Chrome的跨域限制,本地将无法运行,你可以在本站的在线演示中看到效果,或者将源代码上传至自己的服务器后浏览。
阅读全文
posted @
2015-07-31 14:50
html5前端技术分享
阅读(1878)
推荐(0) 编辑
HTML5 3D 粒子波浪动画特效
摘要:

之前我们分享过一个HTML5 3D点阵列波浪翻滚动画,效果非常震撼。今天我们要在来分享一款升级版HTML5 3D粒子波浪动画特效,我们可以旋转不同的视角来欣赏粒子波浪的滚动特效。HTML5在动画制作方面的确让人眼前一亮。
阅读全文
posted @
2015-07-31 14:47
html5前端技术分享
阅读(4224)
推荐(0) 编辑
CSS3手机端侧滑菜单 4种滑动菜单特效
摘要:

这是一款基于CSS3的手机端侧滑菜单,一共有4种侧滑动画特效。这款CSS3菜单的特点是鼠标划过时即可以各种动画方式展开和隐藏菜单项,该动画方式由CSS3中的transition-delay属性来完成,具体效果大家可以看演示。
阅读全文
posted @
2015-07-31 14:43
html5前端技术分享
阅读(1751)
推荐(0) 编辑
HTML5 Canvas生成粒子效果的人物头像
摘要:

前面我们分享过一个HTML5 Canvas实现的图像马赛克模糊效果,HTML5处理图片真的非常简单。今天我们要再利用HTML5 Canvas实现一个粒子效果的人物头像,你可以任意选择一张头像图片,接下来该图片会被打散成许多粒子,然后慢慢的重组成图片,鼠标滑过图片时粒子还会出现浮动的动画特效,看上去非常酷。
阅读全文
posted @
2015-07-31 14:39
html5前端技术分享
阅读(1622)
推荐(0) 编辑
HTML5实现手势屏幕解锁
摘要:

实现原理
利用HTML5的canvas,将解锁的圈圈划出,利用touch事件解锁这些圈圈,直接看代码
阅读全文
posted @
2015-07-31 08:57
html5前端技术分享
阅读(1359)
推荐(1) 编辑
Slideout.js – 触摸滑出式 Web App 导航菜单
摘要:

Slideout.js 是为您的移动 Web 应用开发的触摸滑出式的导航菜单。它没有依赖,自由搭配简单的标记,支持原生的滚动,您可以轻松地定制它。它支持不同的 CSS3 转换和过渡。最重要的是,它只是4KB 。
阅读全文
posted @
2015-07-31 08:53
html5前端技术分享
阅读(707)
推荐(1) 编辑
jQuery图片翻转弹出动画特效
摘要:

今天我们要来分享一款效果很酷的jQuery图片弹出动画,该动画一共有6组,除了第一组普通弹出外,其他图片弹出的时候均会出现各种不同的翻转动画效果,另外有几组的图片时旋转弹出的,效果也非常棒。这款jQuery图片插件可以帮你完成很多图片动画特效。
阅读全文
posted @
2015-07-31 08:50
html5前端技术分享
阅读(685)
推荐(0) 编辑
HTML5来了,7个混合式移动开发框架
摘要:

在这个时间开始学习移动开发真是最好不过了,每个人应该都有一些移动应用的创意,而且你并不需要任何的原生应用编程经验,你只需要一些HTML的相关知识,懂一些CSS和JavaScript就够了。如果你总听别人说HTML5的移动应用太慢,我只能告诉你应该有一些主见,首先HTML5会越来越好,移动端的硬件也会越来越强,怎么说呢,你仔细看一看你手机上的应用吧,很多应用已经悄悄的使用混合式开发了,如果像你说的它们很慢,你发现它们了吗?
阅读全文
posted @
2015-07-31 08:47
html5前端技术分享
阅读(1751)
推荐(1) 编辑
10款很好用的 jQuery 图片滚动插件
摘要:

jQuery 作为最流行的 JavaScript 框架,使用简单灵活,同时还有许多优秀的插件可供使用。其中最令人印象深刻的应用之一就是各种很酷的图片效果,它可以让的网站更具吸引力。这里收集了10款很好用的 jQuery 图片滚动插件分享给大家。
阅读全文
posted @
2015-07-30 20:28
html5前端技术分享
阅读(1207)
推荐(0) 编辑
JS图片自动和可控的轮播切换特效
摘要:

点击这里查看效果:
http://hovertree.com/texiao/js/1.htm
HTML文件代码如下:
阅读全文
posted @
2015-07-30 20:24
html5前端技术分享
阅读(6530)
推荐(1) 编辑
CSS3扇形动画菜单 鼠标滑过扇形展开动画
摘要:

我们之前已经分享过很多CSS3菜单了,很多都比较实用,有部分CSS3菜单外观比较炫酷。今天要分享的这款CSS3菜单外观是扇形的,并且在鼠标滑过菜单时,扇形菜单项将会以动画的方式展开,并且支持多级下拉菜单。
阅读全文
posted @
2015-07-30 20:16
html5前端技术分享
阅读(1175)
推荐(1) 编辑
css里面的几个你不知道的属性
摘要:

azimuth :设置或检索当前声音的音场角度。
举例 div { azimuth : 30deg; }
speak:设置或检索声音是否给出。
举例 acronym { speak: spell-out }
stress:设置或检索当前声音波形的最高峰值。
举例 body { stress: 75 }
richness:设置或检索当前声音的音色。
阅读全文
posted @
2015-05-21 11:33
html5前端技术分享
阅读(982)
推荐(0) 编辑
JS判断是否是微信打开页面
摘要:

function isWeiXin(){
var ua = window.navigator.userAgent.toLowerCase();
if(ua.match(/MicroMessenger/i) == 'micromessenger' || ua.match(/_SQ_/i) == '_sq_'){
return true;
}else{
return false;
}
}
阅读全文
posted @
2015-05-21 11:03
html5前端技术分享
阅读(2614)
推荐(0) 编辑
js的escape()、encodeURI()、encodeURIComponent()区别详解
摘要:

JavaScript中有三个可以对字符串编码的函数,分别是: escape,encodeURI,encodeURIComponent,相应3个解码函数:unescape,decodeURI,decodeURIComponent 。
下面简单介绍一下它们的区别
1 escape()函数
定义和用法
escape() 函数可对字符串进行编码,这样就可以在所有的计算机上读取该字符串。
语法
escape(string)
参数 描述
string 必需。要被转义或编码的字符串。
返回值
已编码的 string 的副本。其中某些字符被替换成了十六进制的转义序列。
阅读全文
posted @
2015-05-21 11:00
html5前端技术分享
阅读(670)
推荐(0) 编辑
使用HTML5的十大原因
摘要:

你难道还没有考虑使用HTML5? 当然我猜想你可能有自己的原因;它现在还没有被广泛的支持,在IE中不好使,或者你就是喜欢写比较严格的XHTML代码。HTML5是web开发世界的一次重大的改变,事实上不管你是否喜欢,它都是代表着未来趋势。其实HTML5并不难理解和使用。我们这里能列出许多原因为什么现在要开始使用HTML5。
阅读全文
posted @
2015-05-21 10:54
html5前端技术分享
阅读(493)
推荐(0) 编辑
Hybrid App开发 四大主流移平台分析
摘要:

Hybrid App在过去的两年中已经成为移动界的核心话题,但是作为一名Web开发者来说要如何站在移动互联网的浪潮之巅呢?是选择学习原生开发,研究Java、Object-C、C#等语言,还是选择继续使用网页开发,容忍HTML5功能的局限性?就在开发者左右为难的情况下Hybrid App作为一个折中的解决方案诞生了。那么究竟什么才是Hybrid App呢?
阅读全文
posted @
2015-05-13 14:59
html5前端技术分享
阅读(1971)
推荐(0) 编辑