我在将javascript/css幻灯片传递到ionic时遇到问题。
Ionic不支持"；。风格"；元素中。请帮忙，下面是代码
<head>
<title>Slideshow</title>
<style>
.slides {display:none;}
</style>
</head>
以上是隐藏所有媒体。下面显示媒体并隐藏
<body>
<h2 class="center">Automatic Slideshow</h2>
<div class="content section" style="max-width:500px">
<img class="slides" src="http://localhost/ads/dashboard/uploads/slides/336d5ebc5436534e61d16e63ddfca3272007281.jpg" style="width:100%">
<img class="slides" src="http://localhost/ads/dashboard/uploads/slides/03c7c0ace395d80182db07ae2c30f0342007221.png" style="width:100%">
<video class="slides" playsinline="playsinline" style="width:100%" autoplay muted webkit-playsinline preload="auto">
<source src="http://localhost/ads/dashboard/uploads/slides/0d43283ccf9d9d6d3a213f5e742425032010261232321.mp4" type="video/mp4">
</video>
<video class="slides" playsinline="playsinline" style="width:100%" autoplay muted webkit-playsinline preload="auto">
<source src="http://localhost/ads/dashboard/uploads/slides/838c0f8d4f2ea2a687935d8546d54c302010261232321.mp4" type="video/mp4">
</video>
<img class="slides" src="http://localhost/ads/dashboard/uploads/slides/8277e0910d750195b448797616e091ad2007281.png" style="width:100%">
</div>
以下是在10秒后更改每个媒体的javascript
<script>
var myIndex = 0;
carousel();
function carousel() {
var i;
var x = document.getElementsByClassName("slides");
for (i = 0; i < x.length; i++) {
x[i].style.display = "none";
}
myIndex++;
if (myIndex > x.length) {myIndex = 1}
x[myIndex-1].style.display = "block";
setTimeout(carousel, 10000);
}
</script>
利用
//将#slides作为包含带*ngfo的子div的包装类的id。
*ngFor="let img of images"
var x = document.getElementsByClassName("slides");
for(i = 0; i < x.length; i++) {
x[i].style.display = "none";
}
//第一次滑动索引必须是1
showDivs(slideIndex += n);
enter code here
//将所有图像置为空//只将显示块放入幻灯片索引
x[slideIndex - 1].style.display = "block";
//对于每个向右箭头按钮，单击向右/向左箭头按钮//幻灯片将开始工作
一次只显示一张图像