We have a page that loads up to show how many people want to be told about something.
On one page there are over 16,000 of them, and they are grouped into DIVs per product.
Trouble is, when you load the page it's churning away to build it, and because the DIVs are all floated, you have to wait for it to load before the foot of the page does the Div Clear, and looks ok.
So is there some form of PHP script that can be active, to say "loading", until query is run?
So a little animated gif at the top shows while it's running, then disappears when the query is complete...??
Or better yet, the screen darkens with a facebox sort of overlay to say "one moment while we compile the information".
Can you show a symbol to say query still running?
Moderator: General Moderators
-
simonmlewis
- DevNet Master
- Posts: 4435
- Joined: Wed Oct 08, 2008 3:39 pm
- Location: United Kingdom
- Contact:
Can you show a symbol to say query still running?
Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.
All the best from the United Kingdom.
Re: Can you show a symbol to say query still running?
You could show a spinner or overlay by default and hide it in body load event handler (this event happens (for a simple page) after the document has completely rendered).
Code: Select all
<style>
body .spinner { display: block; }
body .data { display: none; }
body.loaded .spinner { display: none; }
body.loaded .data { display: block; }
</style>
<body onload="this.classList.add('loaded');">
<div class="spinner"/>
<div class="data">
// a lot of data
</div>
</body>
-
simonmlewis
- DevNet Master
- Posts: 4435
- Joined: Wed Oct 08, 2008 3:39 pm
- Location: United Kingdom
- Contact:
Re: Can you show a symbol to say query still running?
How do I build the handler tho? I don't do handlers. lol
Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.
All the best from the United Kingdom.
Re: Can you show a symbol to say query still running?
This is simplistic example, of course, but it shows the idea.onload="this.classList.add('loaded');"
-
simonmlewis
- DevNet Master
- Posts: 4435
- Joined: Wed Oct 08, 2008 3:39 pm
- Location: United Kingdom
- Contact:
Re: Can you show a symbol to say query still running?
Sorry I mean do I need to add anything else.
Right now with that CSS in the top of the page, and the Spinner div surrounding it all, and the data div inside, it's now showing nothing at all.
Right now with that CSS in the top of the page, and the Spinner div surrounding it all, and the data div inside, it's now showing nothing at all.
Code: Select all
<style>
body .spinner { display: block; }
body .data { display: none; }
body.loaded .spinner { display: none; }
body.loaded .data { display: block; }
</style>
<body onload="this.classList.add('loaded');">
<div class="spinner">
<div class="data">
<?php
if (isset($_SESSION["loggedin"]))
{
.....
}
echo "</div></div>";
?>Love PHP. Love CSS. Love learning new tricks too.
All the best from the United Kingdom.
All the best from the United Kingdom.