可控的纵向图片滚动_图片特效特效

纵向的图片滚动，上下各有控制按钮，点击图片框内的图片就可以向上或向下滚动，滚动步升请根据你的网页布局和其它要求自行修改。

<title>可控的纵向图片滚动</title>
<script>
function up(){
var iup=demo.scrollTop;
var iup1=demo.scrollTop;
while (iup>iup1-210) {
iup=iup-5;
demo.scrollTop=iup;
}}
function down(){
var iup=demo.scrollTop;
var iup1=demo.scrollTop;
while (iup<iup1+210) {
iup=iup+5;
demo.scrollTop=iup;
}}
</script>
<style type="text/css">

</style>
<div class="hpworktext">
  <div class="" style="cursor:pointer" onclick="up()">向上</div>
    <div id=demo style=" overflow:hidden; height:210px; width:100%; margin:auto; overflow: scroll; overflow-x:hidden;">
      <div class="hpworkimg">1</div>
      <div class="hpworkimg">2</div>
      <div class="hpworkimg">3</div>
      <div class="hpworkimg">4</div>
      <div class="hpworkimg">5</div>
      <div class="hpworkimg">6</div>
      <div class="hpworkimg">11</div>
      <div class="hpworkimg">12</div>
      <div class="hpworkimg">13</div>
      <div class="hpworkimg">14</div>
      <div class="hpworkimg">15</div>
      <div class="hpworkimg">16</div>
      <div class="hpworkimg">21</div>
      <div class="hpworkimg">22</div>
    </div>
  <div class="" style="cursor:pointer" onclick="down()">向下</div>
  </div>

所属频道：图片特效特效/更新时间：2012-11-28

[收藏][报错][返回列表]

可控的纵向图片滚动_图片特效特效

图片特效特效Rss订阅特效代码搜索

图片特效特效推荐

猜你也喜欢看这些