H5小内容(五)】的更多相关文章

Geolocation(地理定位)   基本内容     地理定位 - 地球的经度和纬度的相交点     实现地理定位的方式       GPS - 美国的,依靠卫星定位       北斗定位 - 纯国产,惯性定位技术和卫星定位       基站定位 - 移动运营商创建基站(提供信号源)       基于互联网 - IP地址(PC端和移动端)       目前很多浏览器都具有定位功能   HTML5中地理定位     地理定位功能并不是属于HTML5专有内容       HTML5的地理定位技术…
SVG   基本内容     SVG并不属于HTML5专有内容       HTML5提供有关SVG原生的内容     在HTML5出现之前,就有SVG内容     SVG,简单来说就是矢量图     SVG文件的扩展名为".svg"     SVG使用的是XML语法   概念     SVG是一种使用XML技术描述二维图形的语言     SVG的特点       SVG绘制图形可以被搜索引擎抓取       SVG在图片质量不下降的情况下,被放大     SVG与Canvas的区别 …
HTML5目前最新的规范(标准)是2014年10月推出   2005年左右出现HTML5版本(非标准)     W3C组织(两个组织定义H5规范)   学习(研究)HTML5是学习未来(将来主流)   HTML版本 - 第一阶段主要学习还是4版本(包含5版本)     <header><nav>   HTML5版本之后,声明不再出现版本信息     有意地版本,以后可能不再会有新版本     HTML5的规范内容实时更新   注意     HTML5永远都不可能离开javascri…
Web Worker   基本内容     单线程与多线程       Worker可以模拟多线程的效果     定义 - 运行在后台的javascript     注意 - 不能使用DOM       在Worker中只能使用javascript中的ECMA       目前主流浏览器都支持Worker,除IE8之前   Worker提供API     检测当前浏览器是否支持Worker       if( typeof(Worker) !== "undefined" ){     …
Canvas(画布)   基本内容     简单来说,HTML5提供的新元素<canvas>     Canvas在HTML页面提供画布的功能       在画布中绘制各种图形     Canvas绘制的图形与HTML页面无关       无法通过DOM获取绘制的图形       无法为绘制的图形绑定DOM事件     只能使用Canvas提供的API     Canvas用途       在HTML页面中绘制图表(例如柱状图.饼状图等)       网页游戏 - Flash技术       …
音视频处理   视频处理     基本内容       使用Flash技术处理HTML页面中的视频内容         包含音频.动画.网页游戏等  特点    浏览器原生不支持(IE浏览器要求安装ActiveX组件)    性能不好(不能过多地使用)    智能移动端并不支持Flash技术  命运    Flash的母公司Adobe公开宣布放弃       目前用于替代Flash技术最好的选择 - HTML5         几乎所有浏览器原生支持<video>元素  性能更高  智能移动端…
前言: 好久没更新博客了,以前很多都不会,所以常常写博客总结,倒是现在有点点经验了就懒了.在过去的几个月里,在canvas游戏框架方面,撸过了CreateJS,玩得了Egret,又学过PIXI.js.在移动前端方面,尤其是小游戏开始有一点点小经验了.但只是小经验,为什么说是小经验? 首先,深度不足,虽然用得最熟最多的白鹭,可是习惯了JavaScript,对TypeScript的OOP编程掌握得还不够:其次,对Egret等游戏框架了解的广度还不够,还有相当部分用法没用到.虽然能够应付朋友圈里传播的…
安装配置如下: 1. 安装 fcitx sudo apt-get install fcitx 2. 配置默认输入法为 fcitx im-switch -s fcitx // 注意无须加 sudo 3. 重启 x-window 重启之后,fcitx 输入法应当正常启动,输入条将显示在屏幕最上面,不过输入框中文显示可能是 “口口”,需要小小的改动. 4. 修改配置文件 gedit ~/.fcitx/config //如果没有配置gedit 支持GB18030编码,打开后文件会是乱码(此处针对9.10…
Egret白鹭H5小游戏开发入门(一)   前言: 好久没更新博客了,以前很多都不会,所以常常写博客总结,倒是现在有点点经验了就懒了.在过去的几个月里,在canvas游戏框架方面,撸过了CreateJS,玩得了Egret,又学过PIXI.js.在移动前端方面,尤其是小游戏开始有一点点小经验了.但只是小经验,为什么说是小经验? 首先,深度不足,虽然用得最熟最多的白鹭,可是习惯了JavaScript,对TypeScript的OOP编程掌握得还不够:其次,对Egret等游戏框架了解的广度还不够,还有相…
3月23日晚上8点半(中国队火拼韩国的时候),做了一期直播分享.15年做的一个小游戏,把核心代码拿出来,现场讲写了一遍,结果后面翻车了,写错了两个地方,导致运行效果有点问题,直播边说话边写代码还真不一样(可以理解为借口).我先贴出写错的两个地方. 1. //self.last['', ''];//重置 这个是写错的 self.last = ["",""];//重置 这个才是正确的 2. $sword.css({'-webkit-transfrom':'rotateX…
代码地址如下:http://www.demodashi.com/demo/12755.html 项目介绍 本项目是利用原生js实现的h5小游戏-植物大战僵尸,主要结合了一下自己对于h5小游戏的理解,结合面向对象的编程思想进行开发,在实现时使用了部分es6语法,对于es6语法不太熟悉的小伙伴可以先查阅相关资料了解一下. 如有需要,可根据自己的需求修改源码样式.源码配置属性代码,实现个性化定制. 以下为文件目录结构示意图,核心代码在js文件夹下的四个common.js.main.js.game.js…
uni-app跨端自定义navbar+tabbar组件|沉浸式导航条|仿咸鱼凸起标签栏 在跨端项目开发中,uniapp是个不错的框架.采用vue.js和小程序语法结构,使得入门开发更容易.拥有非常丰富的插件生态.支持编译到h5.小程序及App等多个终端平台. 如上图:编译到h5+小程序+App端效果 ◆ 准备 在项目根目录components下新建ua-navbar和ua-tabbar组件. 在main.js中全局引入组件. // 引入自定义组件 import NavBar from './co…
本系列文章对应游戏代码已开源 Sinuous game 上一节介绍了canvas的基础用法,了解了游戏开发所要用到的API.这篇文章开始,我将介绍怎么运用这些API来完成各种各样的游戏效果.这个过程更重要的是参透一些游戏开发的思路和想法,而不是仅仅知道怎么写代码来完成这个游戏. 先用一张图来了解一下整个游戏的构成. Map表示整个背景地图,作用很简单,就是渲染黑色背景.Player 表示玩家粒子,它尾巴中带有生命点,我们用Life类来表示.Enemy为红色的敌人粒子,因为技能粒子和Enemy粒子…
前言: 昨天的文章中简单的介绍了Egret白鹭引擎从安装到基本的使用配置等问题,今天着重介绍H5小游戏开发的起步阶段,如Wing面板的使用,素材的处理,类的说明,开始布局等等. 整体概况: 根据上一篇文章的提示,我们找到index.html,将帧率data-frame-rate修改成60.根据设计图宽高,我将data-content-width设成640,data-content-height设成1038: 就是下图不包括微信工具栏的高度.至于适配模式我先设成exactFit,以canvas的渲…
前言: 在上一篇文章中着重介绍了H5小游戏开发的起步阶段,如Wing面板的使用,素材的处理,类的说明等等,那么今天主要是涉及到场景的创建,loading的修改等等的代码编写. 对于这一节,我在讲解的过程中会使用到众多的类或对象,对于它们的具体用法,建议查看白鹭官方文档. 文档地址:http://edn.egret.com/cn/docs/page/639 修改Loading 上一节我们讲到即将创建场景createGameScene()的时候就结束了,这一节在我们正常创建场景之前,我们先修改一下l…
写在前面 本文实现一个简单的抽奖效果,使用青瓷qici引擎,其中应用了Tween动画,粒子系统,遮罩,UI界面布局,项目设置,发布等功能呢. 目前开发采用1.0.7版本,后续如果界面有所变化请参考这个版本. 所有开发H5的朋友都请先做些demo测试下你目标机的兼容性问题,以免开发好了后,跑不起来. 半年过去了,没想到地址都挂光了.看图片过过瘾吧2016-7-23 16:33:00 demo地址:帮朋友打点小广告,兑奖链接真实有效,微信中打开可以参与兑奖, <!--http://getgeekte…
原文:SQL开发中容易忽视的一些小地方(五) 背景: 索引分类:众所周知,索引分为聚集索引和非聚集索引. 索引优点:加速数据查询. 问题:然而我们真的清楚索引的应用吗?你写的查询语句是否能充分应用上索引,或者说你如何设计你的索引让它更高效? 经历:以前本人只知道索引的好处,但是是否能够真正让它发挥作用,并无太多理论,为些本人做了些DEMO,来简单说明下什么情况下才能充分利用索引. 案例: 这里建立一个学生表:有如下字段,此时表中没有建立任何索引. CREATE TABLE [dbo].[stud…
整体架构: InventionActivity:实现UI的实例化,基本的按钮Activity之间跳转 GameActivity:实现UI的实例化,Webview的基本使用 MyProgressDialog:UI进度对话框属性类 依赖库类: SystemBarTintManager + Config =  实现兼容版本沉浸状态栏 ----------------------我是天天酷涛--------------------------- Webview 运行加载 H5小游戏 Webview基本属…
本系列文章对应游戏代码已开源 Sinuous game. 每个游戏都会包含场景和角色.要实现一个游戏角色,就要清楚角色在场景中的位置,以及它的运动规律,并能通过数学表达式表现出来. 场景坐标 canvas 2d的场景坐标系采用平面笛卡尔坐标系统,左上角为原点(0,0),向右为x轴正方向,向下为y轴正方向,坐标系统的1个单位相当于屏幕的1个像素.这对我们进行角色定位至关重要. Enemy粒子 游戏中的敌人为无数的红色粒子,往同一个方向做匀速运动,每个粒子具有不同的大小. 入口处通过一个循环来创建E…
一 简介 html 超文本标记语言 W3C 中立技术标准机构 W3C标准包括 结构化标准语言(HTML,XML) 表现标准语言(CSS) 行为标准(DOM,ECMAScript) 二 入门例子 <!--告诉浏览器使用规范--> <!DOCTYPE html> <html lang="en"> <!--网页头部--> <head> <!--meta 描述性标签 --> <meta charset="U…
uniapp兼容多端自定义模态弹框组件UAPopup ua-popup 一款轻量级的uniapp自定义弹窗组件.汇集了android.ios和微信弹窗效果(msg消息.alert提示框.dialog对话框.actionsheet底部动作框.toast轻提示.长按定位菜单)等功能. 如下图:H5+App端+小程序效果,亲测多端运行一致. ◆ 引入使用  ▍在main.js中引入uapopup弹框组件 // 引入自定义弹框组件 import uaPopup from './components/ua…
自己开始接触vss 的时候有些小的习惯没有很好的养成,下面的有关VSS内容都是简单的迁入迁出的问题,(仅供参考) 1.文件的迁入迁出:(.txt..xlsx..doc) a:文件的覆盖问题: 对于文件的覆盖,怎样恢复?在vss当中,选中要恢复的文件,右击选择(show history)的内容,再找出原先的文件直接替换就行. b:文件的修改: (方法1).在本地文件中,把只读去掉,打开后直接修改(在本地中),修改保存完成后,再对vss中的文件进行迁出,迁出完成后在迁入即可. (方法2).对于文件的…
人人都说前端用来做游戏是一件很困难的事情,遇到这些js的逻辑性问题,是不是有点懵?其实,做完一款游戏之后就会发现,没啥难的地方,差不多都是换汤不换药,作为爱玩游戏的我,也总结收集了几款比较流行的小软件,下面分享一波源代码,可直接在手机上打开,进入手机浏览器,就能够high起来了. 分享一波关于H5的小游戏 1:飞翔的小鸟 以前用unity3D写过类似于这款小游戏,现在看完这个,是一款基于jQuery+CSS3实现的小鸟飞翔动画特效源码,效果很好,流畅也不卡顿,适配于各种主流浏览器. 2:锅打灰太…
1.简单认识H5 HTML5不仅仅是作为HTML标记语言的一个最新版本,更重要的是它指定了Web开发的一系列标准,成为第一个将Web作为应用开发平台的HTML语言. 我们日常讨论的H5其实是有一个泛称,他指的是有HTML5 + CSS3 + Javascript等技术组合而成的一个应用开发平台. 2.语义化 所谓语义化是要使HTML标签具备很好的可读性,可以很清晰传达每个标签所要表达的意义,一方便其被友好的处理和解析. 3.语义化标签 对于语义化标签我们并不陌生,在此基础上HTML5增加 了更多…
大家好,我是谭叔. 本次,谭叔再度出马,给大家找了一个非常适合练手的软件测试项目,此项目涵盖web端.app端.h5端.小程序端,可以说非常之全面. 缘起 在这之前,谭叔已经推出了九套实战教程. 但是,这些教程以web测试和接口测试为主,没有app等项目.为了让实战项目更加全面.涵盖到各端,同时也为了满足读者粉丝们对项目的高需求,我决定再给大家找一个项目. (实力宠粉,求个赞不过分吧~) 说实话,在找项目的过程中,我下载过(甚至付费下载过)N多个项目.联系过很多项目的作者,但是绝大部分项目,在我…
坑点: 1) iOS 9.1 的safari中,在onTouchBegan方法中调用cc.audioEngine.playEffect播放音效是没有效果的,如果在onTouchEnded调用则是正常的,使用addTouchEventListener来播放也是正常的: 解决方案:在第一次addTouchEventListener回调方法里调用cc.audioEngine.playEffect()后再调用cc.audioEngine.stopAllEffects();之后在onTouchBegan方…
hello,小伙伴们,我们来继续编写相关的程序. 前几章我们已经基本把界面等问题搞定了,现在我们就来写脚本让整个流程统一起来. 看看我们现在有了什么?一个界面还有他的层次结构 青瓷界面绑定UI.js创建 化成关系图如下,我们调整一下, 因为背景应该上面抽出一层,作为公共背景,让这个背景来控制自己到底显示高亮还是暗黑 调整完毕后,我们来划分需要编写的逻辑,前面最高控制整个程序的是UIRoot我们为他创建一个脚本.下面每个脚本控制一个效果. 好的,我们来动手写程序.可以看到我们当前的目录结构如下,S…
前些天看了一篇很赞的文章,又因为想学习phaser,所以有了这个案例,在线预览可以点下方链接. 本案例中,核心原理是按文章中所提到的内容制作,整体遵循"大道至简"的原则开发,其实是懒的去封装模块... 在线预览 文中代码可以访问本人github------ 关键技术点 除去上面提到的文章中的技术点外,还有几处需要注意的地方: 1. 元素渲染层级 开发时候不注意的话,某些情况下可能会出现后面的装饰物,被前面的挡住,或者是机器人被石头挡住等尴尬的局面.对此,不同的框架不同的处理方式,以ph…
###1.classList返回一个对象集 通过obj.classList.add()或obj.classList.remove()可操作对象的class属性值 classList.toggle( )    class属性值中存在则删除,不存在则添加 缺点: 需考虑兼容性,不兼容则需自行定义addClass和removeClass的js模块方法 ###2.自定义属性 自定义属性只有attribute 但在属性前加data-   含有property 该属性含dataset等方法 eg: <inp…
获取select选中内容: 1.获取select表单内容 <select id="sel"> <option value="v1">1</option> <option value="v2">2</option> <option value="v3">3</option> </select> Jquery获取选中的内容: $(&qu…