Simple is Happiness
Less is more
Html5
用CSS和Bootstrap图标制作上下跳动的指示箭头动画效果
by ourjs keys 编程技巧 Html5 1527906827498
有时侯页面很长,需要指示箭头告诉用户下面还有东西。可以用纯CSS的方法实现。
HTML:添加一个链接,可修改锚点点击时滑动到指定位置,这里使用了Bootstrap 3.x版本的一个向下箭头作为图标。

<a href="#" class="scroll-down">
  <span> <i class="glyphicon glyphicon-chevron-down"></i> </span>
</a>
让Select选择框可编辑可输入可自动补全可下拉选择
by ourjs keys 编程技巧 Html5 1503025849015
Datalist是HTML5的原生标签,用于向input提供下拉和自动提示选项,支持输入和下拉选择两种方式。但是目前IE10及其以下浏览器并不支持, 并且IE11无法触发input和change事件。如果仅支持Chrome或Eletron桌面的应用则可以放心使用。
好处不需要引用额外的JS/CSS文件支持,示例:

<input list="cookies" placeholder="Type of Cookie"/>

<datalist id="cookies">
    <option value="Chocolate Chip"/>
    <option value="Peanut Butter"/>
    <option value="Raisin Oatmeal"/>
</datalist>
HTML5的TCP和UDP Web Socket API草案定稿
by kris keys 技术前沿 Html5 1417744190458
这是在Web上实现UDP/TCP API的草案,沿未形成标准。该标准的一大亮点就是使用内置Promise设计模式,替代了传统JavaScript中的事件触发回调。不过各大浏览器厂商会不会这样实现还要打一个问号,毕竟编写标准的学院派和实现标准的行业派很难达到完全统一。
制作canvas游戏
by 1518409521 keys JS学习 Html5 1411479797380
在我上一篇创造<canvas>艺术的帖子中,我介绍了使用HTML5< canvas>API来创建一个随机生成的“北极光”动画。产生动画的效果完全是审美。除了生成颜色和形状它没有提供交互性。在这篇文章中,我们将使用相同的技术介绍原文,但扩展我们的例子介绍键盘输入和操作以创建一个完整的互动游戏。    
我们将创建一个游戏我将他称之为Space。这是一个简单的游戏,你可以使用键盘操作一个二维地图的恒星和行星。为了简便起见,完整的脚本将在这篇文章的底部,我将从脚本片段解释这些到底是什么。
创造canvas的艺术
by 1518409521 keys 编程技巧 Html5 1409578158655
知道<canvas>吗?如果你愿意,将你的注意力集中在这个web文档的顶部。我的网站的头部区域包括一系列的“北极光”动画,是用HTML5′新的JavaScript渲染引擎<canvas>生成的。点击页面任何地方产生新的亮光,每个亮光都带着随机颜色和改变网站头部外观的轨迹,这条轨迹慢慢移动穿过整个页面。
如果你不熟悉<canvas>,学习他的最好方法是去看一个简单的例子。下面的HTML和JavaScript将在<canvas>域内生成一个橙色的矩形区域。
为什么是HTML5?
by 1518409521 keys 行业动态 Html5 1408204672910
曾经有一段时间就是不久之前,当万维网的概念还没有贯穿我们的思想,书还是从纸上读,电影在影院观看。我们买的杂志告诉我们最喜欢的节目什么时候将出现在电视上。我们挤在小小的,模糊,扭曲的屏幕周围享受简单的快乐。那一年是1989年,那一年一个奇妙的事情发生了。变革的种子渗入我们生活的方方面面,我们所有的人,最终被这个神奇的技术革命感动。
翻译:Kendo UI 和 jQuery Mobile的区别
by monkey keys JS开源 Html5 1402299402327
jQuery Mobile 和 Kendo UI 都是流行的HTML5 JavaScript开发框架,在开发中我们可以在它们的基础上制作所有现代移动Web应用。比较 Kendo UI 和 jQuery Mobile 有些类似于比较同一枚硬币的两面。众所周知,jQuery Mobile 实际上并不需要作太多的介绍,因为它是最常用的HTML5框架之一。
你应该使用HTML5的header和footer标签吗?
by ourjs keys 编程技巧 Html5 1400053330828
Matt Wilcox问: “我现在还没有用例如<header>和<footer>这样的标签。我非常惊奇现在有那么多的浏览器开始支持它们了,但是我仍然不知道它们到底比div好在哪了?”
这是个好问题。我的回答是“应该用”。这两个元素(包括<nav>和<main>)是在某些浏览器上给用户带来一些便利的辅助技术。

静态web的回归
by andrewleeson keys 大话编程 Html5 1397059449330

90年代标准的静态web内容正在以充足的理由回归着。Mashable的服务涵盖每一个静态组件——web站点很想要的,与由HTML5,CSS3,和现代JavaScript构建的绝对客户端进行结合,告别单一、静态的页面。

垃圾摇滚,英式摇滚,最初的JavaScript和第一代静态网页
字符串(String)模板引擎被视为是有害的
by andrewleeson keys 编程技巧 Html5 1396179994244

大概内容是:用字符串模板生成HTML是一个低效的过程,它在我们如何概念化Web应用上强加一些不必要的限制因素。如果你用像Ractive.js这样的库或MeteorEmber这样的测试版frameworks,那么你可以没有缺陷的利用模板。如果你不需要使用模板的话,那么React也是一个非常不错的选择。


 近期热门 - 点击最多
  1. JavaScript在Array数组中按指定位置删除或添加元素对象
  2. Node.JS发送http请求批量检查文件中的网页地址、服务是否有效可用
  3. Redis源码分析,在C语言中将当前时间转化成毫秒微秒整数值
  4. Linux下的tar压缩解压缩命令详解,创建解压目录到.tar.gz包
  5. CentOS注册系统服务,添加自动启动脚本
  6. 用OnceOA旺司在树莓派等arm设备免费搭建私有云版有道云笔记文档管理系统,在线编辑Markdown,同步备份手机照片
  7. node.js含有%百分号时,发送get请求时浏览器地址自动编码的问题
  8. Node.JS用纯JavaScript生成图片或滑块式验证码
  9. 树莓派ARM开发板使用TF卡启动和系统安装到EMMC启动,硬盘存储读写速度对比测试
  10. Node.JS枚举统计当前文件夹和子目录下所有代码文件行数

  全端社区 - 最新回复
  1. 一个测试人员眼中的创业团队
  2. Redis源码分析,在C语言中将当前时间转化成毫秒微秒整数值
  3. JavaScript在Array数组中按指定位置删除或添加元素对象
  4. Node.JS发送http请求批量检查文件中的网页地址、服务是否有效可用
  5. Linux下的tar压缩解压缩命令详解,创建解压目录到.tar.gz包
  6. CentOS注册系统服务,添加自动启动脚本
  7. 用OnceOA旺司在树莓派等arm设备免费搭建私有云版有道云笔记文档管理系统,在线编辑Markdown,同步备份手机照片
  8. node.js含有%百分号时,发送get请求时浏览器地址自动编码的问题
  9. Node.JS用纯JavaScript生成图片或滑块式验证码
  10. 树莓派ARM开发板使用TF卡启动和系统安装到EMMC启动,硬盘存储读写速度对比测试

  开源的 OurJS
OurJS开源博客已经迁移到 OnceOA 平台。

  关注我们
扫一扫即可关注我们:
OnceJS

OnceOA