JS代码实现页面切换效果

本文实例为大家分享了JS代码实现页面切换效果的具体代码，供大家参考，具体内容如下

HTML+CSS部分

添加所有页面，和上一页、具体页、下一页的按钮，
设置div样式，默认第一页显示，其他页隐藏。

 
 
 
 
  .item {
  display: none;
  width: 300px;
  height: 400px;
  overflow: hidden;
  position: relative;
  }  
  .item>img {
  width: 100%;
  height: auto;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  } 
  .item.active {
  display: block;
  }
 
 
 
 
  上一页
  1
  2
  3
  4
  下一页
 
 
  
  
  
  
 
 

js部分

通过按键来实现页面的功能

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持考高分网。