H5开发 - 腾讯云开发者社区 - 腾讯云

开发者社区

文档建议反馈控制台

文章/答案/技术大牛

发布

H5开发笔记

1.css实现自动隐藏scroll滚动条但不影响滚动功能谷歌内核webkit .container::-webkit-scrollbar { disp...

9531 0

h5直播webapp项目开发|h5直播案例

这几天闲着没事就捣鼓了下h5直播项目，运用到了html5+css3+jquery+iscroll+wlsPop等技术进行架构开发，解决了直播界面聊天键盘撑起问题，新增了动画消息提示及礼物。...好吧，反正最近这段时间稍微比较清闲，趁着这个机会，在空余时间撸了一个h5仿陌陌直播项目。...h5直播webapp，主要实现的内容如下： [004-360截图20181104095737443.png] 005-360截图20181104095812016.png 006-360截图20181104100100390

8.9K8 3

您找到你想要的搜索结果了吗？

是的

没有找到

比较H5开发与安卓开发

比较H5开发与安卓开发 1. 项目结构对比 H5开发项目结构：在H5开发中，项目结构相对简单，通常包含HTML、CSS和JavaScript文件。...布局和UI设计对比 H5开发的布局和UI设计：在H5开发中，使用CSS进行页面布局和样式设计。响应式设计和Flex布局使得在不同屏幕大小和设备上呈现页面更为简单。...网络请求对比 H5开发的网络请求：在H5开发中，网络请求通常使用JavaScript中的XMLHttpRequest对象或者更现代的fetch API。...多线程处理对比 H5开发的多线程处理：在H5开发中，JavaScript是单线程执行的，但通过Web Workers可以实现在后台运行脚本。...总结与学习资源 H5开发与安卓开发的总结：项目结构和语言差异： H5开发通常使用HTML、CSS、JavaScript，项目结构相对简单。

7791 0

H5游戏开发指南

一直以来，游戏开发都是把前沿技术运用到极致的媒介，H5游戏也不例外，这篇文章会从带你从浅入手，深入H5游戏开发的世界。...我们在H5开发初期的时候，进行了各种尺寸的设计稿尝试，比如1倍的（320X480）、2倍的（640X1136）、3倍的（1242X2280）像素。最终得出的试验结果是。...2.2、资源的加载区别于普通的网页的开发，H5游戏需要大量的视觉听觉素材，并且用户的网络的带宽有限。当你使用了很多的图片、声音、视频以及媒体文件的时候，用户会花费一些时间等待浏览器从服务器下载。...5、结尾当试着用百度搜索了一些“H5游戏开发”之后，发现网上教程很多，什么“45分钟学会H5游戏开发”，“100行代码做个H5游戏”比比皆是，于是就改了主意，从另一角度来阐释游戏开发。...H5游戏开发的思路大都是来自于Flash，Flash有一套现成的开发流程，把它的思想理解之后，对于H5游戏开发好处多多。再次把焦点回到市场上来，“今年将是H5游戏的元年！”

5.2K11 2

移动端H5开发入门

H5做的页面确实超级漂亮。但为了在同事朋友面前装一下，还是要熟悉一下的。然后就可以告诉他们：不就是CSS3新增的那几个动画属性，在加上一下JS的东西嘛，不难！^_^ 昨天看了一下午的一个H5。...然后就是还会有一些背景音乐控制、个别的还存在视频(不用担心，都是H5提供的接口，需要使用时查看一下文档就差不多)；然后就是一些页面之间的过度、这部分可能会用到缩放、透明度转换、以及简单地动画效果...// 下面的代码片段是从一个手机H5页面获取的，是不是发现啥了 function startLoading() { // simulate loading something..

2.5K2 0

移动端H5开发基础

前言随着移动端H5需求场景越来越多，例如微信公众号中H5页面的开发，APP中内嵌H5页面等，移动端H5开发基础知识和技巧是前端开发工程师必备的技能~ 一、移动端屏幕相关概念 1....CSS像素 web开发的最小单位，一个CSS像素在移动设备上最终会转成物理像素去呈像一个CSS像素占用多少个物理像素，取决于【设备特性】、【用户缩放行为】 3....在PC web开发中无意义，无此概念。 4. 位图像素 1个位图像素对应一个设备独立像素，图片才能完美清晰的展现 5....理解了这些基础概念，才能掌握移动端H5开发技巧~ 发布者：全栈程序员栈长，转载请注明出处：https://javaforall.cn/151992.html原文链接：https://javaforall.cn

2.5K3 0

H5 游戏开发 2：搭建 Egret 开发环境

在上一期的“H5 游戏开发”教程中，猫哥介绍了如何通过 Whistle 工具对 Egret 文档进行资源修复和搜索增强。...Egret 官方为开发者和设计师提供了丰富的系列工具产品，帮助提升游戏开发体验和效率。...Egret Live Reload 配置在进行 Web 项目开发时，很多时候我们需要一边编写代码，一边刷新预览页面的呈现效果，H5 游戏开发也不例外。...4.2 添加 .whistle.js 配置代理配置成功后，我们在游戏项目根目录新建 .whistle.js 文件，其内容如下：（注：本配置中包含了 Egret 文档增强功能，具体参看“H5 游戏开发...以上是搭建 Egret 开发环境的全部内容。在下一期，猫哥将会介绍 H5 游戏引擎的技术实现原理，希望对大家理解游戏开发有所帮助，感谢关注：）

5.6K6 0

H5直播源码是什么？H5直播源码如何开发？

H5直播源码是什么？ H5直播也有着一套完整的直播系统，含视频录制端、视频播放端、视频服务器端。...H5直播，推流还是需要移动端或者摄像头，H5直播源码提供更多的依旧是观看，其实与传统直播系统是差不多的。 H5直播源码具有怎样的优势？做品牌宣传的朋友都知道，H5是一个重要的表现方式。...H5直播源码开发中的WebRTC，主要有以下几个优点：具有良好的通用性，几乎在任何平台都可以正常使用。...实际的直播和用户播放的直播会有10秒左右或者更高的延迟，这一点对于后面开发比较重要，一定要注意这个点。...怎么用H5直播源码开发直播功能直播一共有三种状态：直播前，直播中，结束。针对每个状态我们肯定会有不同的显示，这三种状态可以是三个页面，相互切换，或者一个页面，控制页面相关隐藏和显示。

2.6K2 0

原生app开发与h5开发体验对比

从移动客户端转h5开发这一个月左右以来，给我最大的感触就是两者之间本质没有任何区别，为了证明我说的这一点，我将用移动客户端来类比h5，来"证明"我说的两者没有任何本质区别。...h5：用css写一个动画，使用class丢该这个dom节点，但本质上还是对这个view做了一些什么。...当然，从数据的传递上来看：原生app：在intent中放一些参数可以传递过去，回来的时候也可以通过intent携带，参考startActivityForResult.... h5：h5传递参数到下一个页...h5：h5也有自己的页面栈，通过history来管理回退或者前进。...而h5似乎就没有这方面的限制了，随改随修，立马上线。

3.3K9 1

用于H5的移动开发框架

用于H5的移动开发框架今天给大家介绍10款有关HTML5移动开发APP开发框架,这几款框架都是比较优秀的移动 Web 开发框架，能够帮助开发者更加高效的开发移动Web应用。....5 Intel XDK框架　　Intel发布了其首个版本基于web的编程工具，可帮助开发者为Android和iOS开发移动应用。...开发者可用此软件开发基于HTML5的应用，并用于移动设备中。...这样一款能够让开发者使用HTML、JS、CSS来开发跨平台移动App的开源免费框架，一直以来都深受开发者喜爱，从iOS、Android、BB10、Windows Phone到Amazon Fire OS...控件看起来太像网页，没有原生感觉，因此追求原生UI感觉也是我们的重要目标　　MUI以iOS平台UI为基础，补充部分Android平台特有的UI控件　　流畅体验　　• 下拉刷新　　为实现下拉刷新功能，大多H5

7.2K1 0

H5移动端开发学习总结

对于移动端开发而言，为了做到页面高清的效果，视觉稿的规范往往会遵循以下两点： 1.首先，选取一款手机的屏幕宽高作为基准(现在一般选取iphone6的375×667)。...CSS像素:px(设备独立像素) 逻辑像素，浏览器使用的抽象单位(之所以叫抽象单位，是因为其可以根据不同的设备和不同的关系来变大变小，所以称为抽象单位)为Web开发者创造的，在CSS和JavaScript...就是因为其dpr = 2 dpr = 2表示一个CSS像素等于4个物理像素所以：640dp1136dp = 320px568px iphone5对外宣称的640*1136是物理像素，而我们实际开发中用的...但是当屏幕超过一定的尺寸以后还继续显示h5页面的话会给用户带来不好的体验。因此，我们需要给页面设置最大的宽度和最小宽度。

1.7K2 0

H5动画开发快车道

前言以往做一些H5的运营项目，都是动画设计师使用Animate cc（原来的Flash）先设计好动画原型，然后交给我们UI开发来实现。...做过动画开发的童鞋都知道动画开发都是比较耗费时间精力的，而且还要高质量的还原动画设计师设计好的动画，来回沟通成本也非常高。...那有没有一种高效的方法来改善这种流程，提高开发效率的同时还能完成高品质的动画呢？...经过一段时间的摸索，发现AnimateCC（就是原来的Flash）可以导出canvas动画，而且是基于createjs这个开发轻量级游戏的js库的，非常适合用来做移动端的一些h5动画。...比如下面这个小的h5动画，使用上面的animate cc和createjs两天就可以搞定：雪碧图功能如果碰到图片很多的项目怎么办呢？

5.6K8 0

H5 APP开发框架及特点

H5 APP开发框架，是利用HTML5技术构建跨平台移动应用程序的工具集。它们简化了开发流程，使得开发者能用Web技术（HTML、CSS、JavaScript）创建出接近原生应用体验的应用。...以下是一些常见的H5 APP开发框架及其特点。常见H5 APP开发框架：Ionic：特点：基于Angular、React或Vue.js，提供丰富的UI组件。...适用场景：适用于开发注重性能和原生体验的移动应用。MUI：特点：最接近原生开发的H5框架实例。提供了丰富的组件和优秀的适配能力。让开发者能够在Web上，高效的构建高质量的应用。...适用于开发适配不同屏幕尺寸的Web应用。拥有庞大的社区和丰富的资源。适用场景：适用于开发响应式Web应用。H5 APP开发框架的特点：跨平台：一套代码，多平台运行，降低开发成本。...开发效率高：利用Web技术，开发周期短。更新迭代快：无需应用商店审核，热更新方便。技术栈成熟： Web技术生态完善，开发者资源丰富。灵活性强：可根据需求选择合适的框架和技术。

7231 0

用于H5的移动开发框架

用于H5的移动开发框架 ? 今天给大家介绍10款有关HTML5移动开发APP开发框架,这几款框架都是比较优秀的移动 Web 开发框架，能够帮助开发者更加高效的开发移动Web应用。. ?...十款移动APP开发框架 ?...开发者可用此软件开发基于HTML5的应用，并用于移动设备中。...这样一款能够让开发者使用HTML、JS、CSS来开发跨平台移动App的开源免费框架，一直以来都深受开发者喜爱，从iOS、Android、BB10、Windows Phone到Amazon Fire OS...控件看起来太像网页，没有原生感觉，因此追求原生UI感觉也是我们的重要目标　　MUI以iOS平台UI为基础，补充部分Android平台特有的UI控件　　流畅体验　　• 下拉刷新　　为实现下拉刷新功能，大多H5

7.5K4 0

Flutter与原生H5混合开发

我们知道Flutter可以跟原生Android或iOS混合开发，那Flutter能不能与原生H5混合开发呢？答案是：Yes!...给他做个遮罩层 [ca61dd3b340347d59670e5c70498db19~tplv-k3u1fbpfcp-zoom-1.image] 嗯，现在是不是有点感觉了✌️ 但还差点东西，现在Flutter跟原生H5...tplv-k3u1fbpfcp-zoom-1.image] [d333f4dff1344d6a8ffa192f7b5988cc~tplv-k3u1fbpfcp-zoom-1.image] 我们甚至可以把h5...tplv-k3u1fbpfcp-zoom-1.image] *PS：细节的东西我不再多讲，感兴趣的同学，可以自己去看下官方js库的文档( https://pub.flutter-io.cn/packages/js)* Dart原生H5...开发 Dart不仅可以与原生JS互调，也可以拿来写原生网页应用。

4K0 0

H5与原生混合开发总结

一、引言本文主要针对H5与原生混合开发中的交互问题进行讨论，当然，这仅仅是鄙人的见解，求同存异。本文主要针对以下问题进行总结：如何实现JS与Andriod的交互？...如果存在多个H5模块包，如何实现模块包的完全更新与部分更新？针对以上问题的，如何建立一个公用的工具集（框架？）？遇到的问题及解决办法。 OK, 开始吧！...多模块包自动更新支持多模块自动更新的目的是方便更新维护，减少用户升级所带来的流量开支，每个模块包之间可以是相互独立的，也方便于团队开发，仅需要和前端约定好文件目录即可。...五、总结本文基于实际项目，介绍了混合开发中JS与原生交互的实现，然后以一个小实验测试了含WebView的Activity的启动速度，优化，然后测试优化后的启动速度，接着介绍了H5分模块更新的逻辑，最后整理了一套工具集...使用H5混合开发确实能够提升开发速度，但是实际体验确实一般，适合非常追求开发速度的场景。

1.8K2 0

H5 APP开发框架的对比

在开发H5 APP时，选择合适的框架对开发效率和用户体验至关重要。以下是几个主流H5 APP开发框架的对比。...部分原生功能需额外开发。2.Flutter特点: 由Google开发，使用Dart语言，提供丰富的UI组件。优点:高性能，渲染速度快。跨平台支持（iOS、Android、Web、桌面）。...热重载提升开发效率。缺点:Dart语言相对小众。应用体积较大。3.Ionic特点: 基于Web技术（HTML、CSS、JavaScript），支持多种前端框架。优点:开发门槛低，适合Web开发者。...6.Weex特点: 由阿里巴巴开发，使用Vue.js构建跨平台应用。优点:Vue.js开发者易上手。跨平台支持。性能接近原生。缺点:社区和资源较少。文档和工具链不够完善。...Ionic 和 Framework7 适合Web开发者快速构建应用。Vue Native 和 Weex 适合Vue.js开发者。选择框架时需根据项目需求、团队技能和长期维护考虑。

9521 0

H5客服系统开发实现

gofly.v1kf.com 作为一款基于Golang开发的H5客服系统的开发者，今天我想与大家分享我们系统的登录机制设计思路和实现细节。...系统概述我们的H5客服系统主要包含两个入口：直接访问入口：https://域名/h5（通常不建议直接使用）微信公众号入口：通过模板消息通知进入（推荐方式）为什么设计两种登录方式...H5端会话初始化 // H5端入口处理 func HandleH5Entry(c *gin.Context) { // 从微信跳转带有的code获取openid code := c.Query...这种设计充分利用了微信生态的能力，实现了：无感登录：用户无需记忆账号密码即时通讯：通过模板消息实现实时提醒身份绑定：自动关联客服与用户关系作为开发者，我们在...希望这篇分享对正在开发类似系统的同行有所启发。如果你有任何问题或建议，欢迎在评论区交流！

1.2K1 0

H5 APP开发中的性能优化

H5 APP的性能优化是提升用户体验的关键，尤其是在移动端，性能问题会直接影响用户留存率。以下是H5 APP开发中常见的性能优化策略。...6.优化JavaScript性能减少全局变量：避免污染全局命名空间，使用模块化开发。避免内存泄漏：及时清除无用的定时器、事件监听器和DOM引用。...总结H5 APP的性能优化需要从加载、渲染、网络、代码等多个方面入手。通过合理的优化策略和工具支持，可以显著提升应用的性能，为用户提供流畅的体验。在实际开发中，建议结合具体场景，持续监控和优化性能。

6251 0

H5 APP开发的注意事项

开发H5 APP时，虽然可以借助跨平台框架提高效率，但仍需注意多个关键点，以确保应用的质量和用户体验。以下是开发H5 APP时的主要注意事项。...8.代码维护与扩展模块化开发：使用模块化工具（如Webpack、Vite）管理代码。遵循组件化开发思想，提高代码复用性。代码规范：使用ESLint、Prettier等工具统一代码风格。...自定义开发：对于复杂功能，优先考虑自定义开发，减少对第三方库的依赖。10.法律与合规隐私政策：遵守GDPR等隐私保护法规，明确告知用户数据使用方式。...总结开发H5 APP时，需从性能、兼容性、用户体验、安全性、SEO、测试等多个方面综合考虑。通过合理的技术选型和开发实践，可以构建出高效、稳定且用户友好的H5应用。

7331 0

点击加载更多

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭