Slide div from outside website at certain time


I am looking to create sliding div that have the same sort of information as use where a message appears saying something along the lines of “3 people currently viewing this page”. I haven’t got to the dynamic part of it, as I’m trying to get a div to hide off screen then slide into the page after 5 seconds, and be placed at the bottom of the browser window, then after another 5 seconds id like it to slide back off again.

I have the first part working, but cant get the rest of it to work.

#lead_form{background:#000; height:200px; width:200px; display:none; position: fixed; bottom: 77px; right:0px;}

<div id="lead_form"></div>
$(document).ready(function() {
 }, 3000);

Can someone help me expand this to what I described above, as although I’m using the show function, its not really the right one, as I think I need to position the div off screen and then slide it in, and not make it appear, so ye thinking about it that’s wrong isn’t it

1 Like

Something like this perhaps, but the function is wrong somewhere.

#lead_form{background:#000; height:200px; width:200px; position: fixed; bottom: 77px; right:-250px;}

<div id="lead_form"></div>
$(document).ready(function() {
left: "300"
 }, 5000, function() {

Ok tried that and although sort of correct, it just slides from the left for 5 seconds, so its not right, what I want is for it to be hidden away on the right, then slide left after 5 seconds.

Here’s a css version only just for interests sake.

1 Like

Oh right, so just css, that’s interesting, cheers Paul

Or with jquery.

<meta charset="utf-8">
<title>Untitled Document</title>
#lead_form {
	position: fixed;


<script src=""></script>
<div id="lead_form">testing</div>

$(document).ready(function() {
 bottom: "77px"
 }, 5000, function() {
	bottom: "-220px"


1 Like

Yes modern browsers should all handle that quite well.

(Note I just corrected a typo in the keyframe in case you copied the code earlier).

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.