Guest Share Posted February 21, 2015 (edited) Is it possible to create a loading animation to display while the content on a homepage is loading? And is there any standard graphics other than a progress bar that are quick and easy to implement? Edited August 26, 2016 by Guest Link to post
1 squareguru 0 Share Posted July 1, 2016 We made an easy-to-use plugin that lets you make a customized loading animation with no coding knowledge, you can get it for free here: http://www.squareguru.com/loading-animation www.squareguru.com Link to post
0 Guest Share Posted February 27, 2015 (edited) It it was put in the global header wouldn’t it effect the load on every page? I am trying to find a way to do this only on load for the landing page. Where else could you put the code? Edited February 27, 2015 by Guest Link to post
0 dom_1080 51 Share Posted March 1, 2015 (edited) I found this very straightforward to follow in terms of getting a loading page in place: Display Loading Image While Page Loads. Does anyone more jQuery literate know how I would be able to set the page loading animation to last 5 seconds before fading, unless the page loaded before that time in which case it could reveal the page early? Any help would be very much appreciated, I find that some stray elements on my homepage pulled in from other sites can have delays that cause the animation to show for 8 seconds etc. when the page has been 95% loaded many seconds earlier. Edited March 1, 2015 by dom_1080 Link to post
0 Guest Share Posted April 20, 2015 (edited) @octopus Is there a way to make a minimum time of the loader screen visible for even if the page is loaded? Also I would like to use static image rather that the GIF URL you provided. I found something similar to this on Stack Overflow, but I am not a jQuery or JavaScript coder, so I am having a hard time plunging it into the code you listed above. The callouts would need to be modified, but this is what they have: $('.m_top').click( function(){ var name= $(this).attr('href'); $('#c_area').html('<img src="images/loading.gif" alt="Wait" />'); setTimeout( function() { $("#c_area").hide().load(name).fadeIn("normal"); },2000); $("#myDiv").html(''); return false; }); Edited April 21, 2015 by Guest Added more clarification Link to post
0 Guest Share Posted April 22, 2015 (edited) @octopus any further luck? In the article is reference the setTimeout being able to set that minimum time on the page. I guess that was "similar" to someone still learning JQuery and JS. Edited April 22, 2015 by Guest Link to post
0 Guest Share Posted April 22, 2015 @octopus Thanks for updating this answer. Delay works great now. The main reason I wanted to have a delay was to host an image over a background color with a progress bar showing the page loading. I thought I could achieve this by placing a child class in the div class you recommend and setting the style to fixed with a higher z-index, but this does not seem to let the image show. The progress bar is another thing altogether. Link to post
0 TeeTeeLF 0 Share Posted December 17, 2015 So I am using the Aviator template, and when I load this into the sitewide Code Injection, it works. I actually just wanted it to happen on the welcome page, which is an Aviator infopage. I entered it into the header code injection, then added a code block for the div because there is no footer code injection for an infopage. Nada. Any ideas? Site: www.readingremedy.org Thank you so much! Link to post
0 Husky86 0 Share Posted January 4, 2016 I'm looking for a loading animation that will constantly display a percentage of image loaded until complete. Any ideas on where I might find such code? Link to post
0 squareguru 0 Share Posted July 1, 2016 We made an easy-to-use plugin that lets you make a customized loading animation with no coding knowledge, you can get it for free here: http://www.squareguru.com/loading-animation www.squareguru.com Link to post
0 jonberrydesign 39 Share Posted September 1, 2017 @squareguru does this code still exist anywhere? motion graphic designer in SoCal - feel free to check out my site (built on the Polaris template): [motion graphic design by jonberrydesign][1] [1]: http://jonberrydesign.com Link to post
Question
Guest
Is it possible to create a loading animation to display while the content on a homepage is loading?
And is there any standard graphics other than a progress bar that are quick and easy to implement?
Edited by GuestLink to post
Top Posters For This Question
2
1
1
Popular Days
Apr 22
2
Jul 1
2
Feb 21
1
Dec 17
1
Top Posters For This Question
squareguru 2 posts
dom_1080 1 post
TeeTeeLF 1 post
Popular Days
Apr 22 2015
2 posts
Jul 1 2016
2 posts
Feb 21 2015
1 post
Dec 17 2015
1 post
5 answers to this question
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment