<template> | <template> | ||||
<div class="all"> | <div class="all"> | ||||
<img class="pageContent" src="../assets/allMaterials/appliances_high.jpg"> | |||||
<img class="pageContent" :style="{top:-Hig+'rem'}" src="../assets/allMaterials/appliances_high.jpg"> | |||||
<sidebar class="sidebarSty"></sidebar> | <sidebar class="sidebarSty"></sidebar> | ||||
</div> | </div> | ||||
</template> | </template> | ||||
name: "allMaterials_appliances_high", | name: "allMaterials_appliances_high", | ||||
components:{ | components:{ | ||||
Sidebar | Sidebar | ||||
} | |||||
}, | |||||
data(){ | |||||
return{ | |||||
Hig:0 | |||||
} | |||||
}, | |||||
mounted() { | |||||
var Wid = window.innerWidth; | |||||
var Hig = window.innerHeight; | |||||
var height = 750/Wid*Hig; | |||||
this.Hig = 1.5-(height-1206)/2/100; | |||||
}, | |||||
} | } | ||||
</script> | </script> | ||||
<template> | <template> | ||||
<div class="all"> | <div class="all"> | ||||
<img class="imgBg" src="../../assets/vehicle/detailsBg1.jpg" alt=""> | <img class="imgBg" src="../../assets/vehicle/detailsBg1.jpg" alt=""> | ||||
<img class="contImg" src="../../assets/vehicle/allDetails1.png" alt=""> | |||||
<img class="contImg" :style="{top:Hig+'rem'}" src="../../assets/vehicle/allDetails1.png" alt=""> | |||||
<Sidebar class="slide"></Sidebar> | <Sidebar class="slide"></Sidebar> | ||||
</div> | </div> | ||||
</template> | </template> | ||||
components:{Sidebar}, | components:{Sidebar}, | ||||
data(){ | data(){ | ||||
return{ | return{ | ||||
Hig:0 | |||||
} | } | ||||
}, | }, | ||||
mounted() { | |||||
var Wid = window.innerWidth; | |||||
var Hig = window.innerHeight; | |||||
var height = 750/Wid*Hig; | |||||
this.Hig = (height-1206)/2/100; | |||||
}, | |||||
methods:{ | methods:{ | ||||
scrollFn(){ | scrollFn(){ | ||||
var scrollTop = document.documentElement.scrollTop || document.body.scrollTop; | var scrollTop = document.documentElement.scrollTop || document.body.scrollTop; | ||||
width: 6.94rem; | width: 6.94rem; | ||||
height: 22.77rem; | height: 22.77rem; | ||||
position: absolute; | position: absolute; | ||||
top: 1.5rem; | |||||
top: 1.07rem; | |||||
left: 50%; | left: 50%; | ||||
transform: translateX(-50%); | transform: translateX(-50%); | ||||
} | } |
<template> | <template> | ||||
<div class="all"> | <div class="all"> | ||||
<img class="imgBg" src="../../assets/vehicle/detailsBg2.jpg" alt=""> | <img class="imgBg" src="../../assets/vehicle/detailsBg2.jpg" alt=""> | ||||
<img class="contImg" src="../../assets/vehicle/allDetails2.png" alt=""> | |||||
<img class="contImg" :style="{top:Hig+'rem'}" src="../../assets/vehicle/allDetails2.png" alt=""> | |||||
<Sidebar class="slide"></Sidebar> | <Sidebar class="slide"></Sidebar> | ||||
</div> | </div> | ||||
</template> | </template> | ||||
components:{Sidebar}, | components:{Sidebar}, | ||||
data(){ | data(){ | ||||
return{ | return{ | ||||
Hig:0 | |||||
} | } | ||||
}, | |||||
mounted() { | |||||
var Wid = window.innerWidth; | |||||
var Hig = window.innerHeight; | |||||
var height = 750/Wid*Hig; | |||||
this.Hig = (height-1206)/2/100; | |||||
} | } | ||||
} | } | ||||
</script> | </script> |