老师,请教下一个问题

来源:5-8 首页.UI组件-UiSlider(3)

慕盖茨6136029

2019-09-05 14:41:51

如果不像视频中通过改变  图片横向位置  来轮播,而是直接用display:none和display:block来切换,有办法可以平缓切换吗,用transition好像没作用

    btn_prev.on('click',function(){
        if(count<=0){
            count=items.length;
        }
        count--;
        changeImg();
    })
    btn_next.on('click',function(){
        if(count>=items.length-1){
            count = -1;
        }
        count++;
        changeImg();
    })
    tips.on('click',function(){
        count = $(this).index();
        changeImg();
    })
    function changeImg(){
        items.css({"display":"none"}).eq(count).css({'display':'block'});
        tips.removeClass('item_focus').eq(count).addClass('item_focus');
    }


写回答

1回答

好帮手慕星星

2019-09-05

同学你好,

display属性实现显示与隐藏会直接变化,不会有过渡的效果,所以用transition也不会实现。

如果想要淡入淡出效果的话,可以用jquery中的fadeIn和fadeOut方法,例如:

http://img.mukewang.com/climg/5d70c9bd000172ff08730128.jpg

参数是时间,单位是毫秒。

自己可以测试下,祝学习愉快!

1

0 学习 · 14456 问题

查看课程