Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Pull up newer growls on fade out of older ones like in jGrowl. #33

Open
rhine1337 opened this issue Sep 17, 2013 · 10 comments
Open

Pull up newer growls on fade out of older ones like in jGrowl. #33

rhine1337 opened this issue Sep 17, 2013 · 10 comments

Comments

@rhine1337
Copy link

Hi, it would be nice to have the feature of raising up the lower growls in a growl container when the one above it has faded away or has been removed. In the present scenario it stays with an absolute height from the top.

@longlostnick
Copy link
Owner

Great idea. This is something I've wanted to do for a while, but just haven't had the time. Is this something you'd like to implement? Otherwise I'll try and find some time soon to do this myself!

@rhine1337
Copy link
Author

Well, if you can provide a callback when a growl is removed from the DOM then it can be implemented. I liked the simplicity of your implementation but that fixed offset thing is a bit awkward.

@RomainSauvaire
Copy link

I totally agree on this feature, do you have any news @ifightcrime ?

@mouse0270
Copy link

This may not be the best solution, but it has been working for me. Right before the "return $alert;" I wrote this little snippet of code: http://pastebin.com/GbRqMMNg

You can use and update if you like.

@bardware
Copy link

I opened multiple of your growl alerts. Some with type success and a delay of 4000ms, some with type error and delay 0 ms which means the user has to close the notiication.
The green messages were finally gone, the red stood there the spread over the screen. With a larger number of noticiations they cannot be seen as the eight of the viewport is exceeded.

@drmuey
Copy link

drmuey commented Mar 27, 2015

+1

@drmuey
Copy link

drmuey commented Mar 27, 2015

Would be nice if it did this also when you closed a notice. e.g. say you have 5 open and manually close the third one: the fourth and fifth should slide up to fill the space. Would that fit in this issue/PR or maybe a different issue needs submitted?

@jimolina
Copy link

jimolina commented Sep 9, 2015

Hi

In my personal case (show it Top-Right), I did this:

Change line 57:

$(this).alert("close");

$('.bootstrap-growl').each(function( index ) {
   newTop = (parseInt($(this).css('top')) - (parseInt($(this).css('height'))+10)) + 'px';
   $(this).css('top', newTop);
});

Add in the CSS:

.bootstrap-growl {
   transition: all .5s ease-in-out; 
}

@jimolina
Copy link

A little more integrate:

$('.bootstrap-growl').each(function( index ) {
    newPos = (parseInt($(this).css(options.offset.from)) - (parseInt($(this).css('height')) + options.stackup_spacing)) + 'px'
    $(this).css(options.offset.from, newPos);
});

@softwarespot
Copy link

@jimolina, doesn't that shift all growls, therefore some will be out of the visible view port

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

8 participants