cubic-bezier即三次贝塞尔，可以生成贝塞尔曲线，在css中主要是给transition以及animation提供过渡效果的速度曲线 cubic-bezier函数默认接受四个参数，cubic-bezier(x1,y1,x2,y2)，其中y1、y2是可以大于或小于0的，基于此可以做出一些缓冲的 ...
分类：
Web程序 时间：
2021-03-18 14:45:27
阅读次数：
0
<!DOCTYPE html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> ul,li { list-style: none; margin: 0; padding: 0; } .tabBox { wid ...
分类：
Web程序 时间：
2021-01-27 14:03:18
阅读次数：
0
问题一：onSlideChangeEnd回调偶尔不触发 使用 fade 过渡方法，onSlideChangeEnd 回调偶尔触发，偶尔不触发。 因此使用 onTransitionEnd(过渡效果结束之后触发)； var mySwiper = new Swiper('.swiper-container ...
分类：
Web程序 时间：
2020-12-30 10:44:55
阅读次数：
0
<style> /* pc_ban */ .pc_ban .swiper-slide { overflow: hidden; } .pc_ban .sw_bg { width: 100%; height: 600px; top: 0; left: 0; transform: scale(1.1); ...
分类：
其他好文 时间：
2020-12-22 12:02:51
阅读次数：
0
css3属性中关于制作动画的三个属性：Transform,Transition,Animation。 1、transform：描述了元素的静态样式，本身不会呈现动画效果，可以对元素进行 旋转rotate、扭曲skew、缩放scale和移动translate以及矩阵变形matrix。 div{ tra ...
分类：
Web程序 时间：
2020-07-22 23:36:58
阅读次数：
115
官网解释 <transition> 元素作为单个元素/组件的过渡效果。<transition> 只会把过渡效果应用到其包裹的内容上，而不会额外渲染 DOM 元素，也不会出现在可被检查的组件层级中。 Props： name - string，用于自动生成 CSS 过渡类名。例如：name: 'fade ...
分类：
其他好文 时间：
2020-07-10 11:27:05
阅读次数：
94
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css"> //导入css包<hea ...
分类：
其他好文 时间：
2020-07-01 12:49:45
阅读次数：
40
说明 刚开始是打算使用jQuery中的fadeIn和fadeOut方法来完成这种带有渐变效果的轮播图的，由于好长时间没有碰jQuery （实力不允许:) ） ，所以在用jQuery尝试了一下并且失败了之后，就打算使用原生的JavaScript来完成了。 实现原理 我首先在CSS中定义好了两个类，一个 ...
分类：
Web程序 时间：
2020-06-27 20:24:47
阅读次数：
117
将下拉菜单的ul高度设置为0，并且超出部分隐藏掉。 设置下拉菜单的高度添加过渡效果，高度为auto时过渡效果失效。 <style> ul{ list-style: none; margin: 0; padding: 0; } ul li a{ display: block; text-decorat ...
分类：
Web程序 时间：
2020-06-09 20:47:39
阅读次数：
81
在css中使用伪类虽然实现了样式的改变，但由于没有过渡效果会显得很生硬。以前如果要实现过渡，就需要借助第三方的js框架来实现。现在只需要使用CSS3的过渡（transition）功能，就可以从一组样式平滑的切换到另一组样式。 （1）背景色过渡变化 下面鼠标移入后，按钮背景色会慢慢地变成黄色。鼠标离开 ...
分类：
Web程序 时间：
2020-06-07 16:35:02
阅读次数：
232
