Files
2024-10-29 14:04:59 +08:00

112 lines
4.8 KiB
PHTML
Executable File

<!-- 轮播 s -->
<?php
$bigbanners = getBannerList(80, 6);
if ($bigbanners):
?>
<div class="homebans">
<div class="hd">
<ul class="banner_no">
<?php foreach ($bigbanners as $k => $banner): ?>
<li id="<?php echo $banner['alt'];?>"><?php echo $k + 1; ?></li>
<?php endforeach; ?>
</ul>
</div>
<div class="bd">
<ul>
<?php
foreach ($bigbanners as $banner):
$style='center';
if($banner['style']==3) {
$style='right';
}
elseif($banner['style']==2){
$style='left';
}
?>
<li>
<div class="bd-text <?php if(!empty($style)) { echo 'bd-text-'.$style; }?>">
<div class="bd-title <?php if(!empty($style)) { echo 'bd-title-'.$style; }?>" style="color:<?php echo $banner['alt']; ?>"><?php echo $banner['name']; ?></div>
<div class="bd-subtitle <?php if(!empty($style)) { echo 'bd-subtitle-'.$style; }?>" style="color:<?php echo $banner['descolor']; ?>"><?php echo $banner['description']; ?></div>
<a href="<?php echo $banner['url']; ?>"><div class="bd-button <?php if(!empty($style)) { echo 'bd-button-'.$style; }?>">Learn More</div></a>
</div>
<a href="<?php echo $banner['url']; ?>" target="_blank"><img src="<?php echo getImage($banner['picture']); ?>"/></a>
</li>
<?php endforeach; ?>
<li>
<div class="bd-text bd-text-left">
<div class="bd-title fade-in bd-title-left" style="color:#fff">Aerospace-Grade Titanium Case</div>
<div class="bd-subtitle fade-in2 bd-subtitle-left" style="color:#fff">With the watch's LTPO screen and fresh AOD watch faces, you can see key information at a
glance.</div>
<a href=""><div class="bd-button fade-in3 bd-button-left">Learn More</div></a>
</div>
<div class="s4-video hid-mob">
<video data-poster-m="" data-poster-p="" data-poster-wx="" webkit-playsinline="" playsinline="" x5-video-player-type="h5" autoplay="autoplay" loop="" muted="" poster="">
<source type="video/mp4" data-src-p="/frontend/weben/images/home/huawei-watch-4-series-design-1-1.mp4" autoplay data-src-m="/frontend/weben/images/home/huawei-watch-4-series-design-1-1.mp4" src="/frontend/weben/images/home/huawei-watch-4-series-design-1-1.mp4">
</video>
<!--picture>
<img class="wx-img hid-mob" src="/content/dam/huawei-cbg-site/en/mkt/pdp/wearables/watch-4-series/img/kv/huawei-watch-4-series-design-1-3.jpg" alt="HUAWEI WATCH 4 series design">
</picture-->
</div>
</li> </ul>
</div>
</div>
<script type="text/javascript">
jQuery(".homebans").slide({mainCell: ".bd ul", autoPlay: true, delayTime: 3000});
</script>
<script type="text/javascript">
$(function(){
$('.bd li').each(function(item,ele){
if($(this).css('display') == 'none'){
$(this).find('.bd-title').removeClass('animated bounceInUp');
$(this).find('.bd-subtitle').removeClass('animated bounceInUp');
$(this).find('.bd-button').removeClass('animated bounceInUp');
}
else{
$(this).find('.bd-title').addClass('animated bounceInUp');
setTimeout(function(){
$(this).find('.bd-subtitle').addClass('animated bounceInUp');
}, 1000);
setTimeout(function(){
$(this).find('.bd-button').addClass('animated bounceInUp');
}, 1500);
}
});
});
$(function(){
function aa() {
var color = $(".banner_no li[class='on']").attr('id');
$(".header-Index #header").removeClass().addClass(color);
//console.log(color);
}
window.setInterval(aa,300);
})
</script>
<?php endif; ?>
<!-- 轮播 e -->
<style>
.s4-video{
pointer-events: none;
box-sizing: border-box;
}
.bd video {
display: block;
width: 100%;
}
</style>