| | |
| | | position:absolute; |
| | | width: 100%; |
| | | height: 100%; |
| | | background: url(https://yanfeiobpub.obs.cn-east-3.myhuaweicloud.com/dfg/h5loading.gif) no-repeat fixed top; |
| | | background-size: 70px 70px; |
| | | } |
| | | .list{ |
| | | position: relative; |
| | | top: 0; |
| | | width: 100%; |
| | | } |
| | | .reloadbg |
| | | { |
| | | display: flex; |
| | | justify-content: center; |
| | | height: 1.3rem; |
| | | } |
| | | </style> |
| | | </head> |
| | | |
| | | <body> |
| | | <div class="box"> |
| | | |
| | | <!-- <div class="reloadbg"> |
| | | <image class="reloadbgimg" src="https://yanfeiobpub.obs.cn-east-3.myhuaweicloud.com/dfg/h5loading.gif"></image> |
| | | </div> |
| | | --> |
| | | <div class="list"> |
| | | |
| | | |
| | | <img src="https://jpdy.ffquan.cn/static/header_bg.12963398.png" class="top-bg" alt=""> |
| | | |
| | | <div class="list-container" id="fqList"> |
| | |
| | | </div> |
| | | </div> |
| | | </div> |
| | | |
| | | |
| | | |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | ss:0, |
| | | cid:0, |
| | | type:1, |
| | | //posturl:'http://dfg.shop.com', |
| | | posturl:'http://dfg.shop.com', |
| | | // posturl:'http://dfgapp.ushopvip.com', |
| | | posturl:'http://appapitest.ushopvip.com', |
| | | //posturl:'http://appapitest.ushopvip.com', |
| | | platlist:[ |
| | | { |
| | | id:"tb", |
| | |
| | | touch:function() |
| | | { |
| | | const box = document.querySelector('.box') |
| | | const list = document.querySelector('.list') |
| | | const list = document.querySelector('.list'); |
| | | // 按下屏幕的位置 |
| | | let touchStartPosition = 0 |
| | | |
| | | // touchstart事件 |
| | | box.addEventListener('touchstart', function (e) { |
| | | let touch = e.touches[0] |
| | | touchStartPosition = touch.pageY |
| | | // console.log(touchStartPosition) |
| | | let touch = e.touches[0] |
| | | touchStartPosition = touch.pageY |
| | | }) |
| | | // touchmove事件 |
| | | box.addEventListener('touchmove', function (e) { |
| | | let touch = e.touches[0] |
| | | // 列表的top值等于列表相对于box的偏移量+滑动的距离 |
| | | let pySize= list.offsetTop + touch.pageY - touchStartPosition; |
| | | if(pySize<0) |
| | | { |
| | | return; |
| | | } |
| | | var scroll = document.getElementsByClassName('contscore') |
| | | var srollPos = $('.contscore').scrollTop(); //滚动条距顶部距离(页面超出窗口的高度) |
| | | if(srollPos>0) |
| | | { |
| | | return; |
| | | } |
| | | list.style.top =pySize + 'px'; |
| | | // 实现平滑的滑动 |
| | | touchStartPosition = touch.pageY |
| | | |
| | | let touch = e.touches[0] |
| | | // 列表的top值等于列表相对于box的偏移量+滑动的距离 |
| | | let pySize= list.offsetTop + touch.pageY - touchStartPosition; |
| | | if(pySize<0) |
| | | { |
| | | return; |
| | | } |
| | | var scroll = document.getElementsByClassName('contscore') |
| | | var srollPos = $('.contscore').scrollTop(); //滚动条距顶部距离(页面超出窗口的高度) |
| | | if(srollPos>0) |
| | | { |
| | | return; |
| | | } |
| | | list.style.top =pySize + 'px'; |
| | | // 实现平滑的滑动 |
| | | touchStartPosition = touch.pageY |
| | | }) |
| | | // touchend事件 |
| | | box.addEventListener('touchend', function (e) { |
| | | let top = list.offsetTop |
| | | if (top > 70) { |
| | | // 在此处调用刷新后的回调 |
| | | console.log('刷新'); |
| | | location.reload(); |
| | | } |
| | | if(top<0) |
| | | { |
| | | list.style.top=0; |
| | | } |
| | | if (top > 0) { |
| | | // 通过定时器平滑的将list的top = 0 |
| | | let timer = setInterval(() => { |
| | | top=top-5; |
| | | list.style.top = top + 'px' |
| | | if (top <= 0) { |
| | | list.style.top=0; |
| | | clearInterval(timer) |
| | | let top = list.offsetTop |
| | | if (top > 70) { |
| | | // 在此处调用刷新后的回调 |
| | | console.log('刷新'); |
| | | location.reload(); |
| | | } |
| | | },1) |
| | | } |
| | | if(top<0) |
| | | { |
| | | list.style.top=0; |
| | | } |
| | | if (top > 0) { |
| | | // 通过定时器平滑的将list的top = 0 |
| | | let timer = setInterval(() => { |
| | | top=top-5; |
| | | list.style.top = top + 'px' |
| | | if (top <= 0) { |
| | | list.style.top=0; |
| | | clearInterval(timer) |
| | | } |
| | | },1) |
| | | } |
| | | }) |
| | | }, |
| | | scrollLoad: function() { |