kdofficial/src/components/Examples.vue
2025-05-24 01:15:07 +08:00

58 lines
1.7 KiB
Vue

<script setup>
import ExamplesContent from './ExamplesContent.vue';
</script>
<template>
<div class="pageroot" id="examplesprocessroot">
<div id="examplebanner" class="videorootbanner">
<img v-if="$isMobile.android.phone||$isMobile.android.tablet"
src="/ExpVideoPreload.png"
class="videoimg"/>
<video v-else-if="breakpoint==='xs'||breakpoint==='sm'||breakpoint==='md'"
poster="/bannervideopreload.png" controls="controls"
id="bannervideo" muted autoplay="autoplay" loop="loop"
playsinline webkit-playsinline
class="bannervideos"
x5-video-player-type="h5-page">
<source src="/ExpVideo.mp4" type="video/mp4"></source>
</video>
<video v-else
poster="/ExpVideoPreload.png"
id="expbannervideo"
muted autoplay="autoplay"
loop="loop" playsinline webkit-playsinline
class="bannervideos">
<source src="/ExpVideo.mp4" type="video/mp4"></source>
</video>
<div id="expbanner" class="bannerovervideo">
<div class="bannercontent">
<span class="banner1">助力不同行业客户<br /></span>
<span class="banner2">实现业务增长和竞争力提升</span>
</div>
</div>
</div>
<ExamplesContent></ExamplesContent>
</div>
</template>
<script>
import axios from 'axios';
export default {
name: "Examples"
}
</script>
<style scoped lang="scss">
@import "src/publicstyle.scss";
#examplesprocessbanner{
@include media-breakpoint-between(xs, md) {
background-image: url('/ExamplesRes/Examplesbanner_wep.png');
}
@include media-breakpoint-up(md) {
background-image: url('/ExamplesRes/Examplesbanner.png');
}
}
</style>