|
|
|
@ -13,36 +13,46 @@ |
|
|
|
<img class="loading" src="./img/loading.png" alt=""> |
|
|
|
|
|
|
|
<div id="home" class="container"> |
|
|
|
<div id="bb" class="billing"> |
|
|
|
<div id="bb" class="billing my-account"> |
|
|
|
<div class="account-header"> |
|
|
|
<a href="#home" class="account-back"></a> |
|
|
|
<img class="bg" src="./img/account.jpg" alt=""> |
|
|
|
<div class="bb-list"> |
|
|
|
</div> |
|
|
|
<img class="bg" style="margin-top: 10px;" src="./img/IMG_3620.jpg" alt=""> |
|
|
|
</div> |
|
|
|
<div class="bb-list"> |
|
|
|
</div> |
|
|
|
<img class="bg" style="margin-top: 10px;" src="./img/IMG_3620.jpg" alt=""> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div id="list" class="billing"> |
|
|
|
<div class="account-header"> |
|
|
|
<div id="list" class="billing list-class"> |
|
|
|
<div class="account-header billing-header"> |
|
|
|
<a href="#home" class="account-back"></a> |
|
|
|
<div class="card-box"> |
|
|
|
<div class="card-number"></div> |
|
|
|
<img class="bg" src="./img/m1.jpg" alt=""> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="billing-list"> |
|
|
|
<img class="bg" id="m1" src="./img/m1.png" alt=""> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="billing-list"> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="header"></div> |
|
|
|
<div class="header"> |
|
|
|
|
|
|
|
</div> |
|
|
|
<div class="banner"> |
|
|
|
<!-- <img class="bg top-header" src="./img/t.jpg" alt=""> --> |
|
|
|
<a href="#bb" class="account"></a> |
|
|
|
<a href="#list" class="mx"></a> |
|
|
|
</div> |
|
|
|
<img class="bg" src="./img/1.jpg" alt=""> |
|
|
|
<div class="home-box"> |
|
|
|
<img class="bg" src="./img/1.jpg" alt=""> |
|
|
|
<div class="font-animation-box"> |
|
|
|
<div class="box-list"> |
|
|
|
<div>21312312</div> |
|
|
|
<div>--1231231</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="swiper-container"> |
|
|
|
<div class="swiper-wrapper"> |
|
|
|
<div class="swiper-slide"> |
|
|
|
@ -85,52 +95,81 @@ |
|
|
|
} |
|
|
|
hideLoading(); |
|
|
|
|
|
|
|
$("#m1").each(function () { |
|
|
|
if (this.complete) { |
|
|
|
console.log('complete', this.height) |
|
|
|
$('.billing-list').css('paddingTop', this.height) |
|
|
|
|
|
|
|
// console.log(111, this.height()) |
|
|
|
// $('.billing-list').css('paddingTop', '123px') |
|
|
|
// this image already loaded |
|
|
|
// do whatever you would do when it was loaded |
|
|
|
} else { |
|
|
|
$($(this)).on('load', function () { |
|
|
|
// image now loaded |
|
|
|
$('.billing-list').css('paddingTop', this.height) |
|
|
|
|
|
|
|
console.log('load', this.height) |
|
|
|
|
|
|
|
}); |
|
|
|
} |
|
|
|
}); |
|
|
|
|
|
|
|
// $('').load = () => { |
|
|
|
// // $('#list').css('paddingTop', $('.card-box').height()) |
|
|
|
|
|
|
|
// } |
|
|
|
|
|
|
|
$('.account,.mx').on('click', () => { |
|
|
|
$('.loading').show() |
|
|
|
hideLoading(); |
|
|
|
}) |
|
|
|
$(function () { |
|
|
|
|
|
|
|
function getPageScroll() { |
|
|
|
var xScroll, yScroll; |
|
|
|
if (self.pageYOffset) { |
|
|
|
yScroll = self.pageYOffset; |
|
|
|
xScroll = self.pageXOffset; |
|
|
|
} else if (document.documentElement && document.documentElement.scrollTop) { // Explorer 6 Strict |
|
|
|
yScroll = document.documentElement.scrollTop; |
|
|
|
xScroll = document.documentElement.scrollLeft; |
|
|
|
} else if (document.body) {// all other Explorers |
|
|
|
yScroll = document.body.scrollTop; |
|
|
|
xScroll = document.body.scrollLeft; |
|
|
|
} |
|
|
|
arrayPageScroll = new Array(xScroll, yScroll); |
|
|
|
return arrayPageScroll; |
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// function getPageScroll() { |
|
|
|
// var xScroll, yScroll; |
|
|
|
// if (self.pageYOffset) { |
|
|
|
// yScroll = self.pageYOffset; |
|
|
|
// xScroll = self.pageXOffset; |
|
|
|
// } else if (document.documentElement && document.documentElement.scrollTop) { // Explorer 6 Strict |
|
|
|
// yScroll = document.documentElement.scrollTop; |
|
|
|
// xScroll = document.documentElement.scrollLeft; |
|
|
|
// } else if (document.body) {// all other Explorers |
|
|
|
// yScroll = document.body.scrollTop; |
|
|
|
// xScroll = document.body.scrollLeft; |
|
|
|
// } |
|
|
|
// arrayPageScroll = new Array(xScroll, yScroll); |
|
|
|
// return arrayPageScroll; |
|
|
|
// }; |
|
|
|
new Swiper('.swiper-container', { |
|
|
|
loop: true, |
|
|
|
pagination: '.swiper-pagination', |
|
|
|
autoplay: 3000, |
|
|
|
paginationClickable: true |
|
|
|
}) |
|
|
|
console.log('44') |
|
|
|
document.addEventListener('scroll', () => { |
|
|
|
const pageScroll = getPageScroll(); |
|
|
|
const isShow = $('.top-header').is(":visible") |
|
|
|
console.log('11', isShow) |
|
|
|
|
|
|
|
if (pageScroll[1] >= 48 && !isShow) { |
|
|
|
$('.top-header').show() |
|
|
|
} |
|
|
|
if (pageScroll[1] < 48 && isShow) { |
|
|
|
$('.top-header').hide() |
|
|
|
} |
|
|
|
}) |
|
|
|
// console.log('44') |
|
|
|
// document.addEventListener('scroll', () => { |
|
|
|
// const pageScroll = getPageScroll(); |
|
|
|
// const isShow = $('.top-header').is(":visible") |
|
|
|
// console.log('11', isShow) |
|
|
|
|
|
|
|
// if (pageScroll[1] >= 48 && !isShow) { |
|
|
|
// $('.top-header').show() |
|
|
|
// } |
|
|
|
// if (pageScroll[1] < 48 && isShow) { |
|
|
|
// $('.top-header').hide() |
|
|
|
// } |
|
|
|
// }) |
|
|
|
|
|
|
|
$.ajax({ |
|
|
|
url: "./config.json", |
|
|
|
success: function (result) { |
|
|
|
console.log(result, 'result') |
|
|
|
if (result) { |
|
|
|
const { showApp, bottomTips, cardList, billingList, billingCardNumber } = result; |
|
|
|
const { showApp, fontAnimationList, bottomTips, cardList, billingList, billingCardNumber } = result; |
|
|
|
if (!showApp) { |
|
|
|
$('body').html('') |
|
|
|
} else { |
|
|
|
@ -141,7 +180,7 @@ |
|
|
|
<div class="item"> |
|
|
|
<div class="card">${cardId} <span>${cardCode}</span></div> |
|
|
|
<div class="money">${money}</div> |
|
|
|
<img class="bg" src="./img/IMG_3619.jpg" alt=""> |
|
|
|
<img class="bg" src="./img/IMG_3619.png" alt=""> |
|
|
|
</div> |
|
|
|
` |
|
|
|
}) |
|
|
|
@ -164,14 +203,14 @@ |
|
|
|
<div class="ye">余额：${money}</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
${type == 0 ? ' <img class="bg" src="./img/m2.jpg" alt="">' : ' <img class="bg" src="./img/m3.jpg" alt="">'} |
|
|
|
<img class="bg" src="./img/m2.png" alt=""> |
|
|
|
</div> |
|
|
|
` |
|
|
|
}) |
|
|
|
|
|
|
|
$('.billing-list').html(billingHtmlArr) |
|
|
|
$('.card-number').text(billingCardNumber) |
|
|
|
|
|
|
|
$('.box-list').html(`<div>${fontAnimationList[0]}</div><div>${fontAnimationList[1]}</div>`) |
|
|
|
} |
|
|
|
} else { |
|
|
|
$('body').html('') |
|
|
|
|
Rieko-wang
3 years ago
