【问题标题】:Detect when opacity changes检测不透明度何时发生变化
【发布时间】:2013-07-27 22:24:54
【问题描述】:

jquery 或 javascript 中是否有一种方法可以检测元素的不透明度何时发生变化,然后启动一个函数以添加新效果,例如,如果您有一个页面,其中自动发生的事情就像一个元素淡入然后你想要发生这种情况时启动其他东西。你会怎么做???

有点像幻灯片。

这是我目前所拥有的演示:

http://jsfiddle.net/Hive7/n57Zy/

比我想要的当最后一个元素不透明度发生变化然后再次开始循环

提前致谢

【问题讨论】:

  • 请你解释一下,因为我对javascript一无所知
  • 那句话很长。
  • 谁在改变不透明度?那不是你吗,你不应该知道什么时候发生的!
  • 没有跨浏览器/准确的方法可以做到这一点。问题是如何改变不透明度?如果您使用的是 fadeIn() 方法,那么只需使用它的回调

标签: jquery css opacity detect


【解决方案1】:

这是一个示例,如何使用 CSS 检测更改选择器值 javascript。

我的解决方案受到http://darcyclarke.me/dev/watch/ 的启发,使用jquery.watch.js

jQuery(function($){
    $("div").watch('opacity', function(){
        alert("OMG!");
    });
});

JSFiddle: http://jsfiddle.net/KWqUv/1/

【讨论】:

  • 有没有办法不用插件?
  • 我正在尝试在不使用插件的情况下制作幻灯片,这会破坏对象
  • 您可以将其压缩为min 并粘贴到源代码。
  • 正如我所说,仍然会使用插件
  • 我认为像插件一样使用会是最好的。因为它只有一个带有回调的函数。还是一样的……
【解决方案2】:

我正在谈论的一个例子,给你的想法。

var delayOL = d;
var fadeLoop = (function fadeLoop(i) {
    $('.slideshow img').eq(i).delay(delayOL).fadeOut(d, function () {
        i++;
        if (i === $('.slideshow').find('img').length) i = 0;
        $('.slideshow img').eq(i).fadeIn(d, function () {
            delayOL = 0;
            setTimeout(function () {
                fadeLoop(i)
            }, g);
        });
    });
})(0);

DEMO

【讨论】:

  • 我认为您没有正确理解我想要它,以便当元素的不透明度发生变化时,我可以查看它是否是最后一个,然后将其发送回循环的开头
  • 我认为您没有理解我的答案,请使用淡入淡出方法的回调函数,而不是像您的 jsfiddle 中使用超时的这种丑陋的 sn-p。在最后一次淡入淡出时,调用一个循环...
  • 请给我一个演示?
  • 等一下有没有办法在加载后立即停止自动更改
  • 更新的答案,不确定它是你想要的。如果您不想在加载时自动触发它,只需删除 IIFE(匿名自动调用函数),使用经典函数并在需要时调用它。
猜你喜欢
  • 1970-01-01
  • 2010-09-26
  • 2016-12-28
  • 2012-05-05
  • 2011-03-17
  • 1970-01-01
  • 2010-09-15
  • 1970-01-01
  • 2010-12-08
相关资源
最近更新 更多