在同位素onLayout中定义/调用函数

时间:2012-02-11 01:15:51

标签: javascript jquery jquery-isotope

我正在使用http://isotope.metafizzy.co/docs/options.html#onlayout并且它说:

“与回调类似,onLayout是每次Isotope实例运行其布局逻辑后都会触发的函数。”

$('#container').isotope({
   onLayout: function( $elems ) {
    // `this` refers to jQuery object of the container element
    console.log( this.height() );
    // callback provides jQuery object of laid-out item elements
    $elems.css({ background: 'blue' });
    }
});

这意味着当“布局”完成后我可以运行:

 $elems.css({ background: 'blue' });

我没有“$ elems”,但从我能理解的意思是,当“onLayout”结束时,我可以运行我想要的东西,我想运行这个:

$("#container").width(); 
$("#head").animate({ width: newWidth}, "fast");

但“()”中的“$ elems”是怎么回事?

由于

1 个答案:

答案 0 :(得分:1)

您可以将自定义事件绑定到以下元素:

$('#container').bind('my_event', function ()
{
    alert('my_event has just fired!');
});

然后使用.trigger()

调用它
$('#container').trigger('my_event');

使用它,你应该能够很容易地设置你想要的东西。


更新

而不是调用此代码:

$('#container').isotope({
   onLayout: function( $elems ) {
    // `this` refers to jQuery object of the container element
    console.log( this.height() );
    // callback provides jQuery object of laid-out item elements
    $elems.css({ background: 'blue' });
    }
});

请致电:

$('#container').isotope({
   onLayout: function( $elems ) {
        // `this` refers to jQuery object of the container element
        console.log( this.height() );
        // callback provides jQuery object of laid-out item elements
        $elems.css({ background: 'blue' });
        $("#container").width(); 
        $("#head").animate({ width: newWidth}, "fast");
    }
});