CUGGZ的个人主页 - 赞过 - web秀

CUGGZ

6年前

奇技淫巧——CSS 实现波浪效果

奇技淫巧——CSS 实现波浪效果

前言一直以来，使用纯CSS实现波浪效果都是十分困难的。因为实现波浪的曲线需要借助贝塞尔曲线。而使用纯CSS的方式，实现贝塞尔曲线，额，暂时是没有很好的方法。当然，借助其他力量（SVG、CANVAS），是可以很轻松的完成所谓的波浪效果的。下面先来看看非CSS方式实现的波浪效果SVG实现波浪效果借助SVG，是很容易画出三次贝塞尔曲线的。<svgwidth="200px"height="200px"version="1.1"xmlns="http://www.w3.org/2000/svg"><

558480 3702 0

6年前

JavaScript中Async/Await和Promise的区别

JavaScript中Async/Await和Promise的区别

从Node8LTS开始，Node完全支持Async/Await。下面通过简单示例的方式来讲讲Async/Await和Promise的区别。简单介绍下Async/Await:Async/Await是一种新的编写异步代码的方式。其他方式是回调或者Promise。Async/Await实质是构建在Promise之上，它不能用于纯的回调或者Node.js的回调中。和Promise一样，Async/Await是非阻塞的Async/Await很大的特点是，它可以让异步代码看起来就像同步代码那样，大大提高了异步代码的可

558291 3345 0

5年前

JavaScript时间轮盘：js元素圆形布局制作时间轮盘动画

JavaScript时间轮盘：js元素圆形布局制作时间轮盘动画

前言前段时间看抖音，有人用时间轮盘作为动态的桌面壁纸，感觉很好玩，于是突发奇想，可以用JS来实现这个功能。来来来，先看看成果这个效果实现起来其实只有1个难点（其他都不是事），难点就是：元素圆形布局。效果示意图居然是圆，那我们肯定要知道圆心，和半径了，这样才能确定一个圆。先看看上面这个效果图解析：1、圆心：O点、半径r;2、圆心角：∠BOM;3、需要布局的元素：A、B、C、D、E、F、G、H绝对定位的DIV元素;4、DIV绝对定位时的元素的坐标点，可以用left值和top值根据上图，我们知道圆心坐标，半径r

560405 3744 0

6年前

vue插件总结——总有你能用上的插件

vue插件总结——总有你能用上的插件

UI组件框架element-饿了么出品的Vue2的webUI工具套件mint-ui-Vue2的移动UI元素iview-基于Vuejs的开源UI组件库Keen-UI-轻量级的基本UI组件合集vue-material-通过VueMaterial和Vue2建立精美的app应用muse-ui-三端样式一致的响应式UI库vuetify-为移动而生的VueJS2组件框架vonic-快速构建移动端单页应用vue-blu-帮助你轻松创建web应用vue-multiselect-Vue.js选择框解决方案VueCircle

570344 3878 2

6年前

VUE开发一个组件——Vue tree树形结构递归组件

VUE开发一个组件——Vue tree树形结构递归组件

前言Vue开发一个简洁树形结构组件，组件递归组件自身，生成dom。预览图代码预览tree-item通过computed计算hasChild属性，判断当前级别是否还有children，有继续循环组件，依次执行下去，直到没有找到children结束。点击每个item时，也判断是否还有children，有则展开。<template><li><span@click="toggle"><emv-if="hasChild"class="icon">{{open?'-':

582316 3581 5

5年前

CSS3动画解析抖音 LOGO制作

CSS3动画解析抖音 LOGO制作

前言“字节跳动”现今也是如日中天，旗下产品，除头条外，还有短视频平台“抖音”，人气也是非常高，据说拥有7亿用户。今天我们就来研究研究抖音的logo，蹭蹭热度。效果预览：主要用css3新增属性mix-blend-mode，混合模式来实现。分解我们先来看看它的组成，由大写的“J”组成，然后有3种颜色，白色、红色、和天蓝色。ok，我们先来完成一个“J”。根据以往的经验，我们把它拆分成3部分。下面我们来分步骤实现。完成单个“J”<divclass="jitter"><divclass="logo

563440 6284 0

猜你喜欢

换一换

最新文章