suicide-boy Posted July 29, 2007 Share Posted July 29, 2007 Righteo! I'm starting to get to work on a site for me and a mates music projects but it's gonna be split. As an enter page what I wanna do is when the page opens I want the logo image to fly from the left to the center of the screen above a link to the page. If it doen in JS or by the <embed> tag? Thanks Quote Link to comment Share on other sites More sharing options...
php_tom Posted August 6, 2007 Share Posted August 6, 2007 Here's an HTML/JavaScript page that should do the job: <html> <head> <script type='text/javascript'> var t, begin, end, curr, obj; function start() { obj = document.getElementById('img1'); var img_width = 800; var win_width = document.body.offsetWidth; begin = -img_width; end = (win_width/2)-(img_width/2); curr = begin; obj.style.left = curr+"px"; obj.style.visibility = "visible"; t = setInterval("moveLeft();", 10); } function moveLeft() { if(curr>=end) clearInterval(t); else { curr+=2; obj.style.left = curr+"px"; } } </script> </head> <body> <img src='image.jpg' id='img1' onload='start();' align='center' style='visibility:hidden; position:absolute;' /> </body> </html> The variables you need to change are img_width and the src of the img tag. Hope that helps... Quote Link to comment Share on other sites More sharing options...
php_tom Posted August 6, 2007 Share Posted August 6, 2007 Oops! It didn't work in IE... but this should: <html> <head> <script type='text/javascript'> var t, begin, end, curr, obj; function start() { obj = document.getElementById('img1'); var img_width = 800; var win_width = document.body.offsetWidth; begin = -img_width; end = (win_width/2)-(img_width/2); curr = begin; obj.style.left = curr+"px"; obj.style.visibility = "visible"; t = setInterval("moveLeft();", 10); } function moveLeft() { if(curr>=end) clearInterval(t); else { curr+=2; obj.style.left = curr+"px"; } } </script> </head> <body onload='start();'> <img src='image.JPG' id='img1' align='center' style='visibility:hidden; position:absolute;' /> </body> </html> Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.