使用されていない多くの機能を含むプラグイン全体を含めるよりも数行のコードの方が優れているため、独自の通知システムを作成しています。そのため、プラグインを提案しないでください。
ここにフィドルがあります:http://jsfiddle.net/PDa7a/
Click me!
本文の -link を押すと、通知をトリガーできます。ユーザーがスクロールしない限り、これはうまく機能します。ただし、ユーザーがスクロールすると、通知は画面の上部ではなく中央にアニメーション化されます。
コードは次のとおりです。
var notificationHeight = 0;
function notification(message, style) {
var message = $("<span class='notification' data-set='1'>" + message + "<span class='closenotification'>✖</span></span>").appendTo("#notificationContainer");
notificationHeight += message.outerHeight();
console.log(notificationHeight);
message.animate({
top: notificationHeight - message.outerHeight() + "px"
}, function () {
//after start-animation
}).on('click', function () {
var thisser = $(this);
if (thisser.data('set') == 1) {
thisser.data("set", 0);
thisser.css('z-index', '9');
var thisheight = thisser.outerHeight();
notificationHeight -= thisheight;
thisser.nextAll().each(function () {
$(this).animate({
top: $(this).offset().top - thisheight + 'px'
}, {
queue: false
});
}); - thisser.animate({
top: thisser.offset().top - thisheight + 'px'
}, function () {
thisser.remove()
});
}
});
}