<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> <style type="text/css"> *{ margin:0px auto; padding:0px 0px;} #main{ position:absolute; /*自动适应屏幕大小，需要设置位置*/ z-index:-1; } #mian_img{ width:1920px; height:852px; } /*页面中DIV随着页面打开滑动出来*/ #zzz{ /*position:absolute;*/ position:absolute; index:2; bottom:50px; right:0px; width:0px; height:310px; background:url(%E9%A6%96%E9%A1%B5.png); transition:width 2s; -webkit-transition:width 2s; /* Safari */ } </style> <script type="text/javascript"> function aaa(){ document.getElementById("zzz").style.width="700px"; } </script> </head> <body onload="aaa()" style="overflow:hidden;"><!--去掉页面滚动条--><!--onload页面加载时调动方法，实现同步出来--> <div> <div id="main"> <img src="首页.jpg" id="mian_img" /> </div> <div id="zzz"></div> </div> </body>
原文：http://www.cnblogs.com/franky2015/p/4998611.html