61 lines
1.9 KiB
Vue
61 lines
1.9 KiB
Vue
<script setup>
|
|
import ExamplesContent from './ExamplesContent.vue';
|
|
import { useBootstrapBreakpoint } from './useBreakpoint.js'; // 假设 useBreakpoint.js 路径正确
|
|
const { breakpoint } = useBootstrapBreakpoint();
|
|
</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-if="breakpoint==='xs'||breakpoint==='sm'||breakpoint==='md'"
|
|
poster="/ExpVideoPreload.png"
|
|
controls=""
|
|
id="expbannervideo"
|
|
muted autoplay="autoplay"
|
|
loop="loop" playsinline webkit-playsinline
|
|
class="bannervideos">
|
|
<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>
|