【问题标题】:how can i slideDown A Hidden element from 0 opacity to 1 with jquery我如何使用 jquery 将隐藏元素从 0 不透明度滑到 1
【发布时间】:2011-03-29 14:33:57
【问题描述】:

我有一个像下面这样使用 jquery 原型库的可乐:

        new Effect.SlideDown(this.imageDataContainer, { sync: true, duration: this.resizeDuration, from: 0.0, to: 1.0 }), 
        new Effect.Appear(this.imageDataContainer, { sync: true, duration: this.resizeDuration }) 

此代码强制 imageDataContainer 元素从 0 Opacity 向下滑动到 1 Opacity。

如何使用从 jquery.com 网站下载的新 jquery 库来实现上层代码?

slideDown 的语法是这样的: http://www.w3schools.com/jquery/eff_slidedown.asp

我知道 slideDown 和 fadeTo 函数在 jquery 中是如何工作的/但是我怎样才能像上面的代码一样组合它们呢?

我测试下面的代码 - 但你不能改变不透明度 --DURING-- 切换:

          $('#lightbox-container-image-data-box').animate({
            opacity: 0,
            height: 'toggle',
            opacity: 1
          }, 400, function() {
            // Animation complete.
          });

感谢4关注

【问题讨论】:

    标签: javascript jquery opacity slidedown


    【解决方案1】:

    为此使用animate()。使用 animate,您可以为元素上任意数量的属性设置动画。

    在此处查看以下代码的演示:http://jsfiddle.net/chrisramakers/8ewEp/

    $('#book').hide();
    $('#book').animate({
      opacity: 'toggle',
      height: 'toggle'
    });
    

    【讨论】:

    • 谢谢 4 个回答/但我想将 #book 的不透明度从 0 更改为 1 --DURING-- 切换/不在开始和结束切换/我怎么能这样做?
    • @LostLord 我很确定给出的答案会同时为这两个属性设置动画。你看过 jsfiddle 的例子吗?
    • 你应该最初隐藏它,据我所知,在切换过程中不透明度发生了变化。我已经放慢了演示页面上的效果来显示它。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2014-07-05
    • 2012-07-12
    • 1970-01-01
    • 2013-08-30
    • 2012-06-25
    • 1970-01-01
    • 2017-03-14
    相关资源
    最近更新 更多