我想使用一系列图像展开滚动，我不确定出了什么问题，但是当我将鼠标悬停在上面时，什么也没发生。这是我的代码：
<html>
<body>
<img onmouseover="scroll(1)(this)" onmouseout="noScroll(this)" border="0" src="https://lh3.googleusercontent.com/ADI54pjibHuKYxVSWv5c1zKqT1jrJLkGJKkNdGmeg9QGQSn8qmevZmVKxYbHLkBglb9JCSEXMk6KuKD-ym2szJLlp3_HN8RGEM1ShXdfT8U0zQCyU7_18UEZdLfySIUhGnZ83lGhEheMvZcf6KCfAKKLKdGyReBlq-xlxMKhpvtLWVg9Y97_0zkjJ56H6n3_S8GiYDEs2PC_eikNDfHWU9b7n8QLJQ60lv1KNKI8XePgqY0ezhJI2TBAPAliyAH0GsDm6POmEJ2BntdnlhP5LDIZf1Mw9GRrcfCsiYMUJFa23i_uECe4weWo1GcvWltdaKiQtibC8r_-zxJmACJngR854oQIntCSrRZW_FKMRXGQTb2UUWKe9fGz090n3O6qQHAI5TBiPLK3PYPTtSIgxf-ItuwNNGjdKraNiYUGz3r7Hfx3qaJpnG6sLufL52MRCcfQD30X4NDtjny-9uHDXma6BEgwFR-RCtB-qrZJW8xKwZoGDK9mRw6QrYKpHSArZ-wHNbCrJISldQrQM_bFmyQP2xsUTNCYmlcBoHKmAo`HnkVTOLvm4eEJ6_rgDHG8cewbBChCCKh0z28DJvECF6iejEOEu1w7p4Ax0WeE4Q0PBqmo1bemD1DlHNRFXW1c_TLwUponyvDKI3I_VzA`o1Wqq_Tmw2eQ5BEoy-SYEz3XeGOq6g-YTkRw=s969-no" alt="Scroll" width="200" height="200">;
<script>
function bigImg(x) {
setTimeout(scroll(1), 10);
setTimeout(scroll(2), 100);
setTimeout(scroll(3), 200);
setTimeout(scroll(4), 300);
setTimeout(scroll(5), 400);
}
function scroll(1)(x){
<img src="scroll(1).png" alt="scroll(1)">;
}
function scroll(2)(x){
<img src="scroll(2).png">;
}
function scroll(3)(x){
<img src="scroll(3)">;
}
function scroll(4)(x){
<img src="scroll(4).png">;
}
function scroll(5)(x){
<img src="scroll(5).png">;
}
function noScroll(x) {
x.style.height = "200px";
x.style.width = "200px";
}
</script>
</body>
</html>
任何关于语法结构或类似内容的输入都会有所帮助。
这是图像列表的水平滚动。希望这对您有所帮助。
.CSS：-
.img-container {
height: 180px;
width: 100%;
white-space: nowrap;
overflow-x: scroll;
overflow-y: hidden;
}
.item {
position: relative;
display: inline-block;
margin: 8px 8px;
border-top-right-radius: 4px;
width: 150px;
height: 100px;
vertical-align: bottom;
background-position: top left;
background-repeat: no-repeat;
background-size: cover;
}
网页：-
<div class="row-fluid">
<div class="col-lg-12 col-md-10 ">
<div class="img-container">
<!-- START PANEL -->
<div
class="item"
style="background-image: url('http://placehold.it/150x100')"
></div>
<div
class="item"
style="background-image: url('http://placehold.it/150x100')"
></div>
<div
class="item"
style="background-image: url('http://placehold.it/150x100')"
></div> <div
class="item"
style="background-image: url('http://placehold.it/150x100')"
></div>
<div
class="item"
style="background-image: url('http://placehold.it/150x100')"
></div>
<div
class="item"
style="background-image: url('http://placehold.it/150x100')"
></div> <div
class="item"
style="background-image: url('http://placehold.it/150x100')"
></div>
<div
class="item"
style="background-image: url('http://placehold.it/150x100')"
></div>
<div
class="item"
style="background-image: url('http://placehold.it/150x100')"
></div> <div
class="item"
style="background-image: url('http://placehold.it/150x100')"
></div>
<div
class="item"
style="background-image: url('http://placehold.it/150x100')"
></div>
<div
class="item"
style="background-image: url('http://placehold.it/150x100')"
></div> <div
class="item"
style="background-image: url('http://placehold.it/150x100')"
></div>
<div
class="item"
style="background-image: url('http://placehold.it/150x100')"
></div>
<div
class="item"
style="background-image: url('http://placehold.it/150x100')"
></div> <div
class="item"
style="background-image: url('http://placehold.it/150x100')"
></div>
<div
class="item"
style="background-image: url('http://placehold.it/150x100')"
></div>
<div
class="item"
style="background-image: url('http://placehold.it/150x100')"
></div>
<!-- END PANEL -->
</div>
</div>
</div>