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

我正在使用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”是怎么回事？

谢谢

Answer 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"); } });