Jquery hide div/image until page loads using display:none
I am trying to hide an image/div using display:none until the page loads, then it will slide in from page left. How do I get the image to show once the page is loaded and not take up space on the page before so. See: http://jsanim.com/ for example (pretend like the left cloud is 'bunny'.) A new kid thanks you for your help!
function init(){
var manager = new jsAnimManager();
bunnyFly = document.getElementById("bunny");
manager.registerPosition("bunny");
bunnyFly.setPosition(-1320,100);
var anim = manager.createAnimObject("bunny");
anim.add({property: Prop.position, to: new Pos(320,100),
duration: 2000});
anim.add({开发者_运维技巧property: Prop.positionCircle(false), loop:-1, to: new Pos(-300,150), duration: 3000}); }
This is quite simple, just register the window object's onload event handler:
function init() {...}
window.onload = init;
The Window object in the DOM has an onload member of type Function that will get invoked when the corresponding Window is finished loading.
If you're using jQuery, you can use the document.ready event:
$(document).ready(init);
EDIT: You can access the window object from anywhere in your JavaScript code - it is a global object. You can indeed do this in a linked file via a <script> tag:
Blah.js:
function init() {
//your code here...
}
window.onload = init;
//or
$(document).ready(init);
index.html:
<!doctype html>
<html>
<head>
...
<script src="Blah.js"></script>
</head>
<body>
...
</body>
</html>
Just wrap your code in
$(document).ready(function () {
//put your code here
$("#divId").slideDown(); //just an example, use your code for slideLeft
});
加载中,请稍侯......
精彩评论