bootstrap轮播插件carousel图片切换移动速度自定义
2018-01-24 17:56
681 查看
有时候需要图片消失速度不是那么快,但是bootstrap默认是0.6s,真是太快了,这么改
1.在bootstrap.min.css中找到下面代码(可直接搜索transform-3d一下子找到)
@media all and (transform-3d), (-webkit-transform-3d) {
.carousel-inner > .item {
-webkit-transition: -webkit-transform .6s ease-in-out;
-o-transition: -o-transform .6s ease-in-out;
transition: transform .6s ease-in-out;
上面的.6s就是0.6s的意思,太快了,改为2s,千万不要加”.修改后如下
@media all and (transform-3d), (-webkit-transform-3d) {
.carousel-inner > .item {
-webkit-transition: -webkit-transform 2s ease-in-out;
-o-transition: -o-transform 2s ease-in-out;
transition: transform 2s ease-in-out;
1.在bootstrap.min.css中找到下面代码(可直接搜索transform-3d一下子找到)
@media all and (transform-3d), (-webkit-transform-3d) {
.carousel-inner > .item {
-webkit-transition: -webkit-transform .6s ease-in-out;
-o-transition: -o-transform .6s ease-in-out;
transition: transform .6s ease-in-out;
上面的.6s就是0.6s的意思,太快了,改为2s,千万不要加”.修改后如下
@media all and (transform-3d), (-webkit-transform-3d) {
.carousel-inner > .item {
-webkit-transition: -webkit-transform 2s ease-in-out;
-o-transition: -o-transform 2s ease-in-out;
transition: transform 2s ease-in-out;
相关文章推荐
- 可滑动切换的图片轮播——bootstrap中的carousel插件,hammer.js,jquery.hammer.js
- Android的AnimationSet动画实现图片的轮播,移动和切换可以自定义时间
- Bootstrap轮播(carousel)插件中图片变形的终极解决方案——使用jqthumb.js
- bootstrap图片轮播插件carousel
- jq 移动效果可以自定义实现图片切换等效果
- bootstrap 旋转木马carousel 图片轮播
- 第124天:移动web端-Bootstrap轮播图插件使用
- jQuery简单自定义图片轮播插件及用法示例
- Bootstrap 轮播(Carousel)插件
- 轮播插件--Flexslider图片轮播、文字图片相结合滑动切换效果
- Bootstrap 轮播(Carousel)插件
- Bootstrap每天必学之轮播(Carousel)插件
- 自定义插件实现网易云音乐首页图片轮播
- 让Bootstrap轮播插件carousel支持左右滑动手势的三种方法
- Bootstrap轮播插件中图片变形的终极解决方案 使用jqthumb.js
- Bootstrap 轮播(Carousel)插件
- bootstrap的carousel图片轮播
- Bootstrap 轮播(Carousel)插件
- Bootstrap的js插件之轮播(carousel)
- jQuery插件slicebox实现3D动画图片轮播切换特效