jQuery:如何在.css执行后执行操作?

时间:2012-03-05 08:08:57

标签: javascript jquery callback lightbox

所以我的问题很简单,因为在执行.css之后似乎没有回调,在完成任务后我有什么选择来执行某些操作?

我正在创建一个简单的灯箱,我需要等待中心对齐才能完成......

$("#img_lightbox").css("top", top);

所以当完成时,我需要淡出整个事情,但由于没有回调选项(据我所知),它会偶尔在对齐完成之前开始淡入...这怎么能阻止?

感谢任何帮助,谢谢。

3 个答案:

答案 0 :(得分:1)

与jQuery对象链接的任何内容都将在之前的函数之后执行。完成所要求的最简单方法是使用Plugins

jQuery.fn.myPlugin = function () {
    //code to execute
    return this;
}
$("#img_lightbox").css("top", top).myPlugin();

您甚至可以编写一个插件来执行自定义函数,因此您无需为可能需要运行的每个函数创建插件:

jQuery.fn.myCallback= function (callback) {
    this.each(function () {
        callback.call($(this));
    });
    return this;
}
$("#img_lightbox").css("top", top).myCallback(function () {
    // some code to run where this = $("#img_lightbox")
});

但是如果我仍然误解,你可能想要对你的淡入淡出功能进行回调:(否则请澄清更多)

$("#img_lightbox").fadeIn('slow', function () {
    $(this).css("top", top)
});

答案 1 :(得分:1)

添加和删除CSS样式是同步函数 - 没有回调因为下一个语句将在应用样式后执行。 更新样式的渲染略有不同,因为这将在下一次重绘期间发生,但除非您在UI代码中进行一些严重的数字运算,否则差异将完全无法察觉。在任何情况下,它都会在'淡入'开始发生之前应用。

如果您的显示器出现问题,我建议问题出在其他地方。

答案 2 :(得分:-2)

jQuery为您提供了一种方法,可以在文档“准备就绪”并且处于正确状态时正确执行代码。使用以下之一:

$(document).ready(function(){
    //your code here
});

或更短,

$(function(){
    //your code here
});

http://api.jquery.com/ready/

的更多信息