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

开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

IMWeb前端团队

IMWeb前端团队专栏

专栏作者

1369

文章

1860680

阅读量

215

订阅数

动画菜鸡的自我救赎之企鹅辅导品牌页开发总结

css json canvas 网站

一般来说，品牌介绍页都是少不了各种动画的。这里我列出了辅导品牌页的三个主要的动画，后面我会讲我的实现

IMWeb前端团队

2019-12-06

1.8K0

QQ天气H5-前端完整解析

网站 canvas 渲染 css

手Q天气是在手Q 6.0版本以上新增的功能，页面会展现当天的气温情况，已经五天温度折线图以及24小时温度图表等。并且为了更好的交互效果，天气页面会根据8种不同的天气信息，展现相应的天气动画。如下雨下雪，飘云，日光闪烁等动画效果。

IMWeb前端团队

2019-12-04

2.1K1

移动端动画方案

css 云直播 canvas

本文作者：IMWeb 袁飞翔原文出处：IMWeb社区未经同意，禁止转载前言花样直播项目客服端的动画基本已都使用web来做，总结分享一下方案列表 css3动画 canvas 动画播图片 gif图片各个方案的优缺点 css3动画优点：启用css3的3d加速，能够满足性能要求；资源文件最小；缺点：元素量多、复杂的动画难以实现案例：花样交友礼物动画 canvas 动画优点：可以用swf文件直接导出生成，在线导出Google Swiffy (感谢Flash大神龙哥的指导）缺点：性能

IMWeb前端团队

2019-12-04

9330

深入浅出React（一）：React的设计哲学 - 简单之美

javascript canvas react

编者按：自2013年Facebook发布以来，React吸引了越来越多的开发者，基于它的衍生技术，如React Native、React Canvas等也层出不穷。InfoQ精心策划“深入浅出React”系列文章，为读者剖析React开发的技术细节。

IMWeb前端团队

2019-12-04

1K0

canvas 文件存储

FileReader可以将File对象转化成base64，这样可以优先展示图片，然后处理上传操作。

IMWeb前端团队

2019-12-04

7990

前端识别验证码思路分析

canvas 网站图像识别

对于canvas来说，主要是两个方法对图片处理比较重要，一个是通过html5 canvas的 getImageData 方法获取图片的像素信息，可以很方便的通过方法导入到把网络图片或者本地的图片导入至canvas中并获取图片的像素信息，可以修改像素信息后通过另外一个重要的方法putImageData导出处理后的图片。

IMWeb前端团队

2019-12-04

4040

前端新玩具——webGL简介

图像处理 canvas webgl

webGL是基于OpenGL的Web3D图形规范，是一套JavaScript的API。简单来说，可以把它看成是3D版的canvas。恩，你会这样引入canvas对吧：

IMWeb前端团队

2019-12-04

2K0

微信小程序之分享海报生成

canvas 小程序 android iphone api

为了吸引更多的用户，设计好一个分享海报还是很有必要的。而小程序要生成一个海报还是有点坑的，下面分享下我们打卡小程序的一些经验。

IMWeb前端团队

2019-12-03

3.4K0

前端如何呼风唤雨

------------------------------------华丽的分割线-------------------------------------------------

IMWeb前端团队

2019-12-03

4150

Canvas雾玻璃

http canvas html html5

Demo http://lumixraku.github.io/demos/Fog/Fog.html

IMWeb前端团队

2019-12-03

6210

Canvas实现progress效果

html5 api canvas 网站

据说本贵族圈每月不分享就邀请雪糕。。。所以分享下一个简单的Canvas插件　　Canvas元素是HTML5的一部分，允许脚本语言动态渲染位图像，你可以使用javascript用它来绘制图形、图标、以及其它任何视觉性图像。它也可用于创建图片特效和动画。（反正就是好东西）　　既然是HTML5的特性，那必须是只有支持HTML5的浏览器才能使用，兼容性如下图：

IMWeb前端团队

2019-12-03

1.1K0

拥抱更底层技术——从CSS变量到Houdini

javascript 编程算法 api canvas html

平时写CSS，感觉有很多多余的代码或者不好实现的方法，于是有了预处理器的解决方案，主旨是write less &do more。其实原生css中，用上css变量也不差，加上bem命名规则只要嵌套不深也能和less、sass的嵌套媲美。在一些动画或者炫酷的特效中，不用js的话可能是用了css动画、svg的animation、过渡，复杂动画实现用了js的话可能用了canvas、直接修改style属性。用js的，然后有没有想过一个问题：“要是canvas那套放在dom上就爽了”。因为复杂的动画频繁操作了dom，违背了倒背如流的“性能优化之一：尽量少操作dom”的规矩，嘴上说着不要，手倒是很诚实地ele.style.prop = <newProp>，可是要实现效果这又是无可奈何或者大大减小工作量的方法。

IMWeb前端团队

2019-12-03

6810

phantomjs小试

svg canvas javascript node.js 网络安全

简单来说，phantomjs就是一个运行在node上的webkit内核，支持DOM渲染，css选择器，Canvas，SVG等，在浏览器上能做的事情，理论上，phantomjs 都能模拟做到。

IMWeb前端团队

2019-12-03

1K0

摄像机、投影、3D旋转、缩放

图像处理 canvas javascript node.js

3D实体:通过摄像机向投影面发射射线与世界中的物体交汇，把与物体交汇点的颜色渲染到投影面** （光线追踪的基础）。**本系列的所有演示都是3D骨架，非3D实体。本文将穿插图片、公式、代码、演示，让读者深刻理解3D的基本概念极其思想。

IMWeb前端团队

2019-12-03

1.5K0

小程序开发问题笔记

小程序微信 canvas 编程算法 html5

最近从0开始，开发了【企鹅速算检查】小程序，在开发过程中遇到一堆的问(巨)题(坑)，这里记录下来分享给大家。

IMWeb前端团队

2019-12-03

1.1K0

sChart.js：一个小型简单的图表库

vue.js javascript canvas http

sChart.js 作为一个小型简单的图表库，没有过多的图表类型，只包含了柱状图、折线图、饼状图和环形图四种基本的图表。麻雀虽小，五脏俱全。sChart.js 基本可以满足这四种图表的需求。而它的小，体现在它的体积上，代码只有 8kb，如果经过服务器的Gzip压缩，那就更小了，因此不用担心造成项目代码冗余。

IMWeb前端团队

2019-12-03

1.2K0

移动端图片上传旋转、压缩的解决方案

javascript 文件存储 canvas

在手机上通过网页 input 标签拍照上传图片，有一些手机会出现图片旋转了90度的问题，包括 iPhone 和个别三星手机。这些手机竖着拍的时候才会出现这种问题，横拍出来的照片就正常显示。因此，可以通过获取手机拍照角度来对照片进行旋转，从而解决这个问题。

IMWeb前端团队

2019-12-03

2.8K0

利用canvas实现一个抠图小工具

canvas html api

作为新一代的前端开发工程师，PS抠图切图已经不是必备技能了，我们有UI/交互/视觉等更专业的设计同学帮我们做这个事情。但是有时候还是有一些简单的图片处理工作需要我们去做，例如对图片进行剪裁，调整透明度或者调整图片内的文字等等等。这时候如果有一点PS经验那当然更好，如果没有或者当前的开发环境不一定安装了PS等工具，那我们可能需要去找在线图片处理工具来帮我们完成这些工作。

IMWeb前端团队

2019-12-03

1.8K0

移动端动画方案

css 云直播 canvas

《移动端动画方案》一文主要介绍了花样直播项目客服端的动画方案，包括css3动画、canvas动画、播图片、gif图片等方案。css3动画具有性能优势，能够满足性能要求，但实现复杂动画效果较为困难；canvas动画可以实现较为复杂的动画效果，但性能不佳；播图片方案可以解决性能问题，但加载资源较多；gif图片方案容易实现，但有可能出现锯齿等问题。

IMWeb前端团队

2017-12-29

7810

Canvas实现progress效果

html5 canvas api

本文介绍了一种基于HTML5 Canvas的进度条效果实现，通过自定义圆形的路径和文本，可以实现自定义圆的大小、进度条的长度、以及文本的大小和颜色。同时，该实现还包含了清除画布和绘制圆形的功能。该效果可以用于各种需要展示进度的地方，比如视频剪辑、游戏开发等。

IMWeb前端团队

2017-12-29

1.5K0

点击加载更多

社区活动

腾讯技术创作狂欢月

“码”上创作 21 天，分 10000 元奖品池！

Python精品学习库

代码在线跑，知识轻松学

博客搬家 | 分享价值百万资源包

自行/邀约他人一键搬运博客，速成社区影响力并领取好礼

技术创作特训营·精选知识专栏

往期视频·千货材料·成员作品最新动态