You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
140 lines
4.9 KiB
140 lines
4.9 KiB
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<!-- 通用 -->
|
|
{include file="common/head" /}
|
|
<!-- 当前 -->
|
|
<link rel="stylesheet" href="__TMPL__/static/scss/open_account.css">
|
|
</head>
|
|
|
|
<body>
|
|
<!-- header start -->
|
|
{include file="common/header" /}
|
|
<!-- header end -->
|
|
<!-- banner start -->
|
|
<div class="bannerList">
|
|
<div class="img"><img src="__TMPL__/static/images/open_account/reservationBanner.jpg" alt=""></div>
|
|
<div class="w1280">
|
|
<div class="bannerTitle">开户服务</div>
|
|
</div>
|
|
</div>
|
|
<!-- banner end -->
|
|
<div class="pageListNav">
|
|
<div class="w1280">
|
|
{hcTaglib:subcategory pid="8" item="vo" field="id,title" sort="sort asc"}
|
|
<a href="{:hcUrl('list/index',['id'=>$vo.id])}" class="{$current_cate['id']==$vo.id?'on':''}">{$vo.title}</a>
|
|
{/hcTaglib:subcategory}
|
|
</div>
|
|
</div>
|
|
<div class="brankBlock">
|
|
<div class="w1280">
|
|
<div class="openAccountTit">
|
|
<p>支持的银行借记卡</p>
|
|
<div class="menu">
|
|
<div class="swiper-button-prev"></div>
|
|
<div class="swiper-button-next"></div>
|
|
</div>
|
|
</div>
|
|
<div thumbsSlider="" class="brankList pc">
|
|
<div class="wrapper">
|
|
{hcTaglib:content cid="$current_cate['id']" moduleId="1" name="hc_content"
|
|
mainField="id,title,description,thumbnail" sort="sort asc"}
|
|
<div class="slide">
|
|
<div class="img">
|
|
<img src="{$vo.thumbnail.url}" alt="">
|
|
</div>
|
|
<p>代码：{$vo.description}</p>
|
|
</div>
|
|
{/hcTaglib:content}
|
|
</div>
|
|
</div>
|
|
<div thumbsSlider="" class="swiper brankList">
|
|
<div class="swiper-wrapper">
|
|
{hcTaglib:content cid="$current_cate['id']" moduleId="1" name="hc_content" mainField="id,title,description,thumbnail" sort="sort asc"}
|
|
<div class="swiper-slide">
|
|
<div class="img">
|
|
<img src="{$vo.thumbnail.url}" alt="">
|
|
</div>
|
|
<p>代码：{$vo.description}</p>
|
|
</div>
|
|
{/hcTaglib:content}
|
|
|
|
</div>
|
|
</div>
|
|
<div style="--swiper-navigation-color: #fff; --swiper-pagination-color: #fff" class="swiper brankInfo">
|
|
<div class="swiper-wrapper">
|
|
{hcTaglib:content cid="$current_cate['id']" moduleId="1" name="hc_content" mainField="id,title,content,sub_title" sort="sort asc"}
|
|
<div class="swiper-slide">
|
|
<div class="tit">{$vo.sub_title}</div>
|
|
<span></span>
|
|
<div class="content">
|
|
{$vo.content|raw}
|
|
</div>
|
|
</div>
|
|
{/hcTaglib:content}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- footer start-->
|
|
{include file="common/footer" /}
|
|
<!-- footer end -->
|
|
<!-- 通用 -->
|
|
{include file="common/foot" /}
|
|
<!-- 当前 -->
|
|
<script src="__TMPL__/static/js/layui.js"></script>
|
|
<script>
|
|
var swiper = new Swiper(".brankList.swiper", {
|
|
spaceBetween: 20,
|
|
freeMode: true,
|
|
watchSlidesProgress: true,
|
|
navigation: {
|
|
nextEl: ".swiper-button-next",
|
|
prevEl: ".swiper-button-prev",
|
|
},
|
|
breakpoints:{
|
|
319:{
|
|
slidesPerGroup: 3,
|
|
spaceBetween: 10,
|
|
slidesPerView: 3,
|
|
grid: {
|
|
rows: 2,
|
|
},
|
|
},
|
|
750:{
|
|
spaceBetween: 20,
|
|
slidesPerView: "4",
|
|
grid: {
|
|
rows: 2,
|
|
},
|
|
},
|
|
1080:{
|
|
spaceBetween: 20,
|
|
slidesPerView: "6",
|
|
grid: {
|
|
rows: 2,
|
|
},
|
|
}
|
|
}
|
|
});
|
|
var swiper2 = new Swiper(".brankInfo", {
|
|
autoHeight: true,
|
|
spaceBetween: 10,
|
|
|
|
thumbs: {
|
|
swiper: swiper,
|
|
},
|
|
});
|
|
$(".brankList.pc .slide").click(function(){
|
|
console.log($(this).index() ,'切換');
|
|
|
|
swiper2.slideTo($(this).index())
|
|
})
|
|
</script>
|
|
</body>
|
|
|
|
</html>
|