Need to get rid of a notification more gracefully

[schwim]

Hi there everyone!

I’ve got a notification div that can be dismissed via ajax and that part’s working well but I’m wondering if there’s a way to get the banner to disappear a bit more gracefully. I’ve seen things like what I’m talking about but I’m not sure what to search for.

My banner: https://s-esx.com/fivemin/async.html

Click on the Dismiss button for a demo of the notification that I’d like to make a little less jarring and abrupt.

Any insight would be most welcome. Thanks for your time!

[PaulOB]

This is really a JS question so you can try the following but it may not be the right answer

You can try and fadeout the div before you remove it.

e.g.

Change this:

success: function (response) {
			$( "#notification_dismissed" ).remove();
		}

to this:

success: function (response) {
			$( "#notification_dismissed" ).fadeOut( function() { $(this).remove(); });
		}

[rpkamp]

I’m personally a fan of slideUp for stuff like this:

success: function (response) {
  $( "#notification_dismissed" ).slideUp( function() { $(this).remove(); });
}