Authored by QC-L

修复多余线条的问题,并添加滚动切换

... ... @@ -35,7 +35,6 @@
</div>
{{/if}}
{{> group/resources/filter-tab}}
</div>
<div id="goodsContainer">
{{#if filterList.length}}
... ...
... ... @@ -3,12 +3,12 @@
<div class="guess-scroll">
{{#each data}}
{{#ifcond @index '==' 0}}
<div class="guess-tab first" data-query="{{queryString}}">
<div id="tab-{{@index}}" class="guess-tab first" data-query="{{queryString}}">
<img class="guess-img" src="{{image2 src w=200 h=160 q=60 mode=3}}" />
<div class=""></div>
</div>
{{^}}
<div class="guess-tab" data-query="{{queryString}}">
<div id="tab-{{@index}}" data-index="{{@index}}" class="guess-tab" data-query="{{queryString}}">
<img class="guess-img" src="{{image2 src w=200 h=160 q=60 mode=3}}" />
<div></div>
</div>
... ...
... ... @@ -231,6 +231,7 @@ class Group extends Page {
guessLikeTabChange(e) {
let $this = $(e.currentTarget);
let query = $this.data('query');
let index = $this.data('index');
let queryObject = {};
let newNavType = this.judgeNavType(this.newFilterTab);
let newNav = this.newNavInfo[newNavType];
... ... @@ -241,6 +242,9 @@ class Group extends Page {
queryObject.page = 1;
newNav.page = 1;
newNav.query = queryObject;
let lastDom = document.getElementById(`tab-${index - 2}`);
$('.wapper').animate({scrollLeft: lastDom && lastDom.offsetLeft || 0});
$.ajax({
type: 'GET',
... ...
... ... @@ -7,6 +7,8 @@
overflow-x: scroll;
-ms-overflow-style: none;
overflow: -moz-scrollbars-none;
-webkit-overflow-scrolling: touch;
height: 110px;
.guess-scroll {
display: flex;
... ... @@ -14,6 +16,7 @@
flex-wrap: nowrap;
width: auto;
min-width: 100%;
height: 88px;
.guess-tab {
min-width: 160px;
... ... @@ -33,12 +36,16 @@
}
.guess-tab-active {
height: 4px;
margin-top: -10px;
height: 2px;
width: 70%;
background-color: #222;
}
.wapper::-webkit-scrollbar { width: 0 !important; }
.wapper::-webkit-scrollbar {
width: 0 !important;
display: none;
}
}
.guess-like.float {
... ...