这是我的建议。由于没有办法将 jGrowl 放在 DIV 上,无论是向左还是向右浮动,我们将在渲染后转移它。下面是我从原始示例中获取的代码。
(function($){
$.jGrowl.defaults.pool = 5;
$.jGrowl.defaults.sticky = true;
$.jGrowl.defaults.life = 2500;
$.jGrowl.defaults.closer = true;
$.jGrowl.defaults.open = function(e,m,o) {$("#jGrowl").css('right', $('#header').offset().left + 17);};
/**
* @todo Add the twitter avatars to tweets, via tweet.user["profile_image_url"]
* @todo Find a way to calculate the dates relatively
* @todo Test is a cookie plugin is available so that some of this data can be 'cached'
*/
$.jTweet = function( username , total ) {
$.getJSON("http://twitter.com/status/user_timeline/" + username + ".json?count=" + total + "&callback=?", function(response) {
$.each(response, function(i, tweet) {
$.jGrowl( (tweet.text.replace(/[A-Za-z]+:\/\/[A-Za-z0-9-_]+\.[A-Za-z0-9-_:%&\?\/.=]+/, function(m) {
return m.link(m);
})) + ' [' + tweet.source + ']' , {
header: tweet.created_at ,
} );
});
});
};
$.jTweet('jquery', 5);
})(jQuery);
这里重要的部分是这一行:
$.jGrowl.defaults.open = function(e,m,o) {$("#jGrowl").css('right', $('#header').offset().left + 17);};
这将 jGrowl 对象的 right 属性与我的 header 的 left 属性对齐。这基本上转移了它的位置,使它看起来好像在标题的 div 下。