相关内容
原生JS实现特效留言框
给大家分享一个用原生js实现的特效留言框，效果如下：? 实现代码如下，欢迎大家复制粘贴。 原生js实现特效留言框 * { margin: 0; padding: 0 } textarea{ overflow: auto; resize: none; } li { list-style: none; } html{ height: 100%; } body { background: #570226; height: 100%; font: arial, helvetica, sans...
原生JS实现目录滚动特效
分享一个用原生js实现的文字滚动效果，这种效果通常用在网页中一些局部展示信息，如新闻、动态、充值记录等，效果如下：? 实现代码如下： 原生js实现目录滚动特效 body { font-size: 12px; line-height: 24px; text-align: center; } * { margin: 0px; padding: 0px; } ul { list-style: none; } a img{ border: none...
用代码生成Glitch Art风格的抖音字体
最近看到不少文章教大家用 photoshop 实现抖音的 logo 跟字体，我也非常喜欢这种风格的字体，于是趁着晚上的时间，动手用代码实现了下此类风格的字体特效，顺便开发了个小工具，地址见文末。 本文主要是从艺术手法和 js 前端实现 2 个方面进行梳理，我们可以看到如何用代码来描述艺术手法，达到自动化生成某一风格...
用代码生成Glitch Art风格的抖音字体
最近看到不少文章教大家用 photoshop 实现抖音的 logo 跟字体，我也非常喜欢这种风格的字体，于是趁着晚上的时间，动手用代码实现了下此类风格的字体特效，顺便开发了个小工具，地址见文末。 本文主要是从艺术手法和 js 前端实现 2 个方面进行梳理，我们可以看到如何用代码来描述艺术手法，达到自动化生成某一风格...
英文字体的选择
英文字体想要精通是比较难的，因为存在文化上的鸿沟和环境的熏陶，这里写的也只是一些皮毛，欢迎大家指正和交流。 ----往期精选文章使用虚拟dom和javascript构建完全响应式的ui框架扩展 vue组件使用three.js制作酷炫无比的无穷隧道特效一个治愈javascript疲劳的学习计划全栈工程师技能大全web前端性能优化常见方法一...
内置资源
微剪插件内置了常见的视频编辑资源：特效、滤镜、贴纸和字体等，并且还在不断维护增加中。 v1.4. 0 版本的微剪新增了统一获取内置资源的方式，供开发者取得内置资源并在 ui 中展示。 获取内置资源app.js 配置var myplugininterface = requireplugin(myplugin); app({ onlaunch: function () { let resources = my...
在HTTP2中管理CSS和JS
----往期精选文章es6中一些超级好用的内置方法浅谈web自适应使用three.js制作酷炫无比的无穷隧道特效一个治愈javascript疲劳的学习计划全栈工程师技能大全...适用于网站的头部，底部，重置，字体，和其他通用样式。? index.scss如下所示:@import .. configindex; @import _fonts.scss; @import _reset.scss...
更新日志
支持：wj-export 组件支持通过调用 js api 导出。 optimize 优化：插件体验优化。 优化：插件自定义字体切换为可商用字体。 bugfix 修复：编辑页面设置...12.08bugfix 修复：重复设置特效无法覆盖 bug。 修复：播放器初始化报错，再次进入黑屏 bug。 修复：部分转场动效在 android 端不生效 bug。 修复：导出...
集成组件 API
2 版本以后加入了字体功能，需要额外进行字体配置：字体的下载需要借助小程序的 loadfontface 方法，需要在index.js中，将 loadfontface 方法通过 exports...rgba(0,0,0,0.8), 特效面板 effect: { 自定义icon，不传使用默认icon icon:https:xx.xx.xx, 游标颜色，此处的movablecolor和下面的highlightcolor不填则取...
简洁的HTML5视频播放器UI特效开源库
简要介绍这是一款简洁的html5视频播放器ui特效。 该html5视频播放器ui采用响应式设计，通过css代码来构建视频播放器的界面，整体效果时尚简洁。? 使用方法在页面中引入modernizr.min.js，font-awesome字体文件和style.css样式文件，以及jquery和jqueryui和vedio.js文件。 css结构* @import url(maxcdn.bootstrapcdn...
前端字体截取技术，做炫酷网站再也不用怕中文字体数据量大啦！【实战】
自己整理了一份2018最全面前端学习资料，从最基础的html+css+js【炫酷特效，游戏，插件封装，设计模式】到移动端html5的项目实战的学习资料都有整理，送给每一位前端小伙伴，有想学习web前端的，或是转行，或是大学生，还有工作中想提升自己能力的，正在学习的小伙伴欢迎加入学习。 点击：加入...
人工智能作曲、算法作曲指南
https:github.comjnordberggif.js 6.4a-framethreejs的高级封装库，3d图形的生成，或用于ar、vr。 https:aframe.io 6.5 blotter.js用着色器语言生成字体特效。 https:blotter.js.org 6.6tonejstone.js是一个在浏览器中创建交互式音乐的框架。 https:tonejs.github.io 6.7 wavesurfer.jswavesurfer.js是一个用于音频...
原生JS实现加载进度条
分享一个原生js实现的动态加载进度条特效，效果如下：? 实现的代码如下：原生js实现加载进度条 #progressbox { width: 300px; height: 40px; border:1px solid #c8c8c8; background: white; position: relative; margin: 0 auto; margin-top: 100px; } #progressbar { position: absolute; left: 0; top: 0; z-index...
CSS中字体相关的小技巧
}p { font-family: my san francisco alias, fantasy; 这么定义后，san francisco在任何情况下都是可用的。 ----往期精选文章使用虚拟dom和javascript构建完全响应式的ui框架扩展 vue组件使用three.js制作酷炫无比的无穷隧道特效一个治愈javascript疲劳的学习计划全栈工程师技能大全web前端性能优化常见方法一小时内...
HTMLCSSJS 是如何在浏览器中，渲染成你看到的页面？【图解Chrome】
自己整理了一份2018最全面前端学习资料，从最基础的html+css+js【炫酷特效，游戏，插件封装，设计模式】到移动端html5的项目实战的学习资料都有整理，送给...计算页面布局是一个很复杂的工作，即使最简单的从上到下的块流结构，也必须考虑字体的大小以及如何划分每一块，因为它们会影响当前段落的大小和形状...
nodejs 打印五彩斑斓的黑
前言笔者上一篇博客 《如何在命令行中显示五彩斑斓的“黑”》，讲到了任何编程都可以在命令行终端打印彩色字体和彩色背景的文字，以及一些简单文本格式（粗体，下划线，闪烁，反转背景色，隐藏），并给出了 python 语言的实现。 为了让前端开发的同学也能快速使用这一功能，在自己的项目中输出漂亮的日志，笔者用 js ...
原生JS实现腾讯视频轮播图
给大家分享一个用原生js实现的腾讯视频轮播图特效，实现效果如下：? 以下是代码实现，欢迎大家复制粘贴。 原生js实现腾讯视频轮播图 window.onload = function (){ 获取最外层容器 var odiv = document.getelementbyid(box); 获取每一个大图选项 var apicli =document.getelementbyid(pic_list).getelementsbytagname...
播放器 API
特效轨道使用说明添加特效轨道。 this.effecttrack = new global.track({ type: effect, clips: 创建 effect clip：let effectclip1 = new global.clip({ ...给文字添加字体。 由于小程序插件无法调用 wx.loadfontface 方法，因此需要小程序手动暴露该接口给插件，或者在小程序内提前加载字体后再传入插件渲染...
数据结构
一组完整的视频编辑数据是以轨道为单位的数组，每个轨道内存储了对应类型的 clip 片段。 词汇含义 tracktrack 即轨道，播放器支持多种轨道，如：媒体（视频 或者 图片）、音乐、特效、滤镜、文字等。 每一种类型的轨道对应不同类型的 track。 clipclip 即轨道中的素材片段。 例如： 需要编辑三段视频，那么需要将三个...
VUE+WebPack游戏设计：实现外星人攻击冲击波
页面会出现“wave cleared”的字体显示特效，startwave启动新一轮冲击波流程，wavescleared在冲击波结束后，负责清理页面和各种数据结构。 接下来我们实现冲击波流程的动态效果：change 6 wavetick () { if (!this.waves.isactive) { return } if(this.cjs.ticker.getticks() % this.waves.currentwave.frequency ===...
