Commit 03b94183 authored by Nature's avatar Nature

s-tab

parent 9d77b282
......@@ -4,5 +4,5 @@
@import "ionic";
@import 'publicStyle';
@import "ionic-public-style";
@import "platform-iosx";
@import "platform-ios";
@import "platform-iosx";
......@@ -36,19 +36,20 @@ export default {
.h-view {
width: 100%;
height: 100%;
overflow: hidden;
// background-color: $bgColor;
}
// iPhoneX适配
@media only screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3) {
.h-view{
.h-ios{
padding-bottom: 42px;
}
}
// iPhoneX Max适配
@media only screen and (device-width: 414px) and (device-height: 896px) {
.h-view{
.h-ios{
padding-bottom: 42px;
}
}
......
<template>
<section :class="[c(),tabCss, cusClass,overFlow]">
<section :class="[c(),tabCss, cusClass,overFlow]" >
<section :style="transform" class="tab-content">
<slot/>
</section>
......@@ -32,7 +32,7 @@ export default {
},
overflowX: {
type: Boolean,
default: false,
default: true,
},
},
data () {
......@@ -40,7 +40,6 @@ export default {
items: [],
length: '',
activedIndex: '',
deviceWidth: window.innerWidth,
translate: 0,
}
},
......@@ -69,6 +68,7 @@ export default {
transform () {
return {
transform: 'translateX(' + this.translate + 'px' + ')',
// transition: 'right 0.3s cubic-bezier(0.35, 0, 0.25, 1), left 0.3s cubic-bezier(0.35, 0, 0.25, 1) 0.09s;',
}
},
},
......@@ -86,18 +86,22 @@ export default {
},
scrollToActiveTab (index, width) {
let clientWidth = this.$el.clientWidth
index += 1
let vm = this
let count = Math.floor(vm.deviceWidth / width)
let overFlowWidth = vm.deviceWidth - count * width
let count = Math.floor(clientWidth / width)
let overFlowWidth = clientWidth - count * width
let num
if (index > count) {
num = index - count
if ((vm.count - index) >= 1) {
num += 1
}
} else {
num = 0
}
if (num === 0) {
vm.translate = -num * width
vm.translate = 0
} else {
vm.translate = -num * width + overFlowWidth
}
......@@ -113,7 +117,7 @@ export default {
.hls-switch-tab {
width: 100%;
position: absolute;
// position: absolute;
z-index: 1;
display: flex;
// justify-content: space-around;
......@@ -121,7 +125,7 @@ export default {
background-color: #fff;
&-top {
top: 0;
// top: 0;
&:after {
.setBottomLine();
......@@ -129,7 +133,7 @@ export default {
}
&-bottom {
bottom: 0;
// bottom: 0;
&:before {
.setTopLine();
......
......@@ -69,7 +69,7 @@ export default {
display: flex;
align-items: center;
justify-content: center;
padding: 0 3px;
// padding: 0 3px;
border-bottom: 1px solid rgba(255, 255, 255, .0); /*no*/
}
......
......@@ -215,7 +215,7 @@
self.platforms = []
var grade = 'a'
if (self.isWebView()) {
/*if (self.isWebView()) {
self.platforms.push('webview')
if (!(!window.cordova && !window.PhoneGap && !window.phonegap)) {
self.platforms.push('cordova')
......@@ -225,13 +225,13 @@
} else {
self.platforms.push('browser')
}
if (self.isIPad()) self.platforms.push('ipad')
if (self.isIPad()) self.platforms.push('ipad')*/
var platform = self.platform()
if (platform) {
self.platforms.push(platform)
var version = self.version()
/*var version = self.version()
if (version) {
var v = version.toString()
if (v.indexOf('.') > 0) {
......@@ -247,10 +247,10 @@
} else if (self.isWindowsPhone()) {
grade = 'b'
}
}
}*/
}
self.setGrade(grade)
// self.setGrade(grade)
},
/**
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment