Posted By admin
Tags: ,
Centered Processing Modal
Demo

This is amazing. ! Thanks. Is there a way to make the greyed-out area fill the entire screen ? Because as it is right now, the user could still press any button or link that is not covered by that area …,I would try putting the modal at the end of your body tag (or at least outside of the most parent container). Hope that works out!,Nice :D,Exactly what I was looking for – thank you.Any idea how I’d trigger this from jQuery/JavaScript?,Well, I’ve got it appearing using:$( ‘#modal-processing’ ).modal( { show: true } );but setting {show:false} doesn’t make it disappear – any ideas?,Aha!,$( ‘#modal-processing’ ).modal( ‘toggle’ );,Actually, ‘toggle’ was acting a bit funky in my code, but then I discovered $( ‘#modal-processing’ ).modal( ‘hide’ ); – perfect, if a little obvious! (in hind-sight).,Thanks for your implemantation Travis, but I have a dumb question: How the modal will close when my request is complete?,LOL thats a fair question. This can be closed with the Modal JavaScript API provided by Bootstrap:,$(‘#myModal’).modal(‘hide’);,Hope that helps!,Travis your snippets are awesome! What would I do without you,Glad I can help! I’m about to push my float label pattern sample for Bootstrap – be sure to check it out!,Instead using a .GIF, you could’ve used a font icon and some basic CSS3 to do the rotating cogwheel.,Or use: < i class=”fa fa-cog fa-5x fa-spin” > < / i >,Good suggestion, but I wanted to favor the most cross-browser- and cross-platform-solution for a demo like this. For a process this important, ensuring that everyone can see it anywhere is the most important aspect.,If you have the luxury of dealing only with CSS3 browsers, that would be a great way to do it.,So simple but so awesome! ,Thanks!,The author is travislaynewilson

1 Star2 Stars3 Stars4 Stars5 Stars (No Ratings Yet)
Loading...

Related Snippets

Leave a comment

Your email address will not be published. Required fields are marked *