如何检测用户是否正在通过移动Web浏览器查看我的网站,以便我可以自动检测并显示我的网站的相应版本?
我使用 Bootstra 4 中的容器将页面内容置于浏览器中间。到目前为止还算正常。
但我还需要更多东西。容器内的内容应在左侧展开,并应扩展到浏览器窗口。但仅限于左侧。
因为我使用的是光滑滑块,所以我无法position:absolute在容器 DIV 中的单个对象上使用或执行其他操作。我需要容器内有一个完整的 DIV 才能生长到左侧。我需要容器将其右侧与页面的其余部分对齐。
这是我的实际代码:https ://codepen.io/cray_code/pen/erQJey
这就是我需要的。幻灯片内的图像应向左增长。蓝色背景是浏览器窗口:
<div class="bg-dark">
<div class="container bg-white">
<div class="slider">
<div><img src="http://via.placeholder.com/2500x500" class="img-fluid"></div>
<div><img src="http://via.placeholder.com/2500x500" class="img-fluid"></div>
<div><img src="http://via.placeholder.com/2500x500" class="img-fluid"></div>
</div>
</div>
</div>
<script type="text/javascript">
$(document).ready(function(){
$('.slider').slick({
infinite: true,
dots: true,
arrows: false,
draggable: false,
fade:true,
autoplay:true,
autoplaySpeed: 4000,
speed:1200,
})
});
</script>
Run Code Online (Sandbox Code Playgroud)