HTML5在线教程和技术博客

  • A-Frame WebVR(网页虚拟现实)快速开发入门教程

    WebVR和WebGL应用程序接口使得我们已经可以在浏览器上创建虚拟现实(VR)体验,但从工程化的角度而言,开发社区还需要更多方便强大的开发库来简化编程,Mozilla的>A-Frame>框架就是这样一个工具,提供了一个Web开发者所熟悉的标记语言来快速构...

    阅读全文 收藏 评论 (0) 阅读 (3310) 2017-04-06 21:26:31  
  • Blender2.7给平面模型添加纹理贴图

    在blender中给模型添加纹理,需要有2个步骤:首先在对象属性栏中给该对象添加材料和纹理建立纹理映射添加材料和纹理这是常见操作,略过步骤。但是仅仅这样操作,你会看到模型视图中只有材质是生效了的,而纹理并不能正常渲染。因为我们还没有建立纹理映射坐标,渲染器并不知道该把图像如何映射到平面模型上去。建立纹理映射打开一个新的UV Editor视图,在该视图中打开一个图像文件。在原模型视图中,按Tab切换到编辑(editor)模式,按U,在UV Mapping右键菜单中选择“Unwrap”即可:

    阅读全文 收藏 评论 (0) 阅读 (537) 2017-03-29 14:52:05  
  • WebAssembly工作原理和JavaScript语言性能对比分析

    本文简单说明WebAssembly(简称wasm)工作原理和高性能的原由(和JavaScript相比)。不过需要提醒的是Wasm并非设计来完全替代JS,而是对JS的一个强大补充,JS中一部分高性能应用可以使用wasm来进行替代,比如React小组就准备用Wasm来重写其Reconciler部分(该部分用来管理组件加载和刷新),这些变动对React的使用者不可见...

    阅读全文 收藏 评论 (1) 阅读 (1052) 2017-03-07 15:13:03  
  • 创建非矩形网页页面元素的常用技术和实例代码

    非矩形设计正在变成一种时尚,比如波浪形、菱形、三角形等:而随着技术发展,这种设计在技术实现上也变得更容易。本文以最简单的三角形为例,演示使用5种方法来达到非矩形设计的界面效果。使用透明图片遮盖[TD_Editor] data-height=450 data-theme=embed data-slug-id=33381 data-default-tab=result class=tdwow[/TD_Edito...

    阅读全文 收藏 评论 (0) 阅读 (596) 2017-03-01 17:07:11  
  • WebGL、Asm.js和WebAssembly概念简介

    随着HTML技术的发展,网页要解决的问题已经远不止是简单的文本信息,而包括了更多的高性能图像处理和3D渲染方面。这正是要引入WebGL、Asm.js和WebAssembly这些技术的原因。什么是WebGLWebGL是为了给Web添加类似桌面(或移动)系统上的OpenGL的特性支持,从而实现强大的3D图形渲染效果。什么是Asm.jsAsm.js是一个JavaScript...

    阅读全文 收藏 评论 (1) 阅读 (1204) 2017-02-27 13:00:56  
  • CSS3属性选择器特性使用详解

    CSS3除了引入动画、滤镜(用于特效)以及新的布局技术外,在选择器(selector)方面也有增强。属性选择器根据元素的属性(attributes)来匹配。这可以是一个单独的属性,比如[type],或者可以是一个属性和取值的组合,比如[type=checkbox] 或 [for="email"]。我们也可以用属性选择器来匹配属性存在与否以及子字符...

    阅读全文 收藏 评论 (0) 阅读 (462) 2017-02-21 18:15:59  
  • WebGL Roadmap

    Unity 5.0 shipped with a working preview of our WebGL technology in March this year. Since then, Google has disabled (by default) NPAPI support in their Chrome browser (meaning that the Unity Web Player will no longer work there) which is pushing a lot of Unity developers to try out WebGL as an alte...

    阅读全文 收藏 评论 (0) 阅读 (507) 2017-02-08 20:12:09  
  • CSS3原生变量(Native Variables)新特性简介

    对Web开发者来说,一个盼望已久的特性是CSS终于支持原生变量了!
    变量是程序语言中用来解决代码重复和进行表达式计算的关键概念(想想数学方程式中的x)。这样CSS看起来更像一门样式“语言”了。在这之前,我们得使用SASS(SCSS)预编译方式来支持变量,现在你可以直接在CSS代码中使用变量。该特性的规范描述在

    阅读全文 收藏 评论 (0) 阅读 (461) 2017-02-07 12:35:59  
  • CSS3特性查询(Feature Query: @supports)功能简介

    这是2017年不能不了解和学习的一个CSS新特性,非常实用,考虑到现实世界浏览器的复杂性,该特性本应该先于其他新特性出来。我们已经知道使用媒体查询(Media Query)来检测屏幕尺寸,从而实现响应式界面设计。
    而特性查询则用来查询用户代理(如桌面浏览器)是否支持某个CSS3的特性,这个功能除了IE之外,已被其他浏览...

    阅读全文 收藏 评论 (0) 阅读 (402) 2017-02-06 12:01:46  
  • React JSX语法简介

    JSX是一种类似XML的标签语法,用来简化代码,我们可以不使用JSX,但了解并使用也没什么坏处:)在React中,JSX是一个使用 React.createElement() API的快捷方式,代码看起来更象一个UI组件。每个标签,比如 &View /foo='hello',或者使用大括号包含起来的内嵌JS表达式,比如 bar={baz},baz将引用变量baz。标签可以...

    阅读全文 收藏 评论 (0) 阅读 (506) 2017-01-17 16:44:19