Make a image as page load

Question

0.00/5 (No votes)

See more:

Hi,

I am trying to make an image as page load, i.e till the html is fully rendered i will show a loading image, say a gif image. So till the the page is not fully rendered, the user must not be able to click anything on the page. In order to do that i must show the image over the entire page right? So how can i acieve this. Can any one please help me.

I am doing it in Angular JS and the problem is the time delay happens in rendering rather than data fetch.

Posted 18-Aug-14 2:58am

Arjun Menon U.K

Updated 18-Aug-14 4:01am

v3

Add a Solution

Comments

Nathan Minier 18-Aug-14 9:07am

Implementation largely depends on if you're looking for async or sync operation.

E.F. Nijboer 18-Aug-14 9:07am

Your question is very unclear. Please be more clear. What does "make an image" actual mean for example?

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

JasonMacD · Answer 1 · 2014-08-18T03:56:00

Solution 1

Not a very easy task to accomplish without a plugin. I use BlockUI to accomplish this: http://malsup.com/jquery/block/[^]

Posted 18-Aug-14 3:56am

JasonMacD

Comments

Arjun Menon U.K 18-Aug-14 10:18am

I can't write the Javascript section as i am using Angular JS , anyway thanks for the reply

JasonMacD 18-Aug-14 15:18pm

There is always a way to get it done, just have to do some research and try a few things. This is a plugin like BlockUI specifically for Angular JS: https://github.com/McNull/angular-block-ui

JasonMacD 18-Aug-14 15:19pm

This forum post also says BlockUI the first plugin I suggested does work with Angular JS http://stackoverflow.com/questions/23368709/jquery-blockui-plugin-and-angular-display-ajax-call-time-as-incremented-seconds

JasonMacD 18-Aug-14 15:22pm

http://plnkr.co/edit/XWRfHX?p=preview