Html CSS有div的图像经过并滚动

我有一个里面有图像的div，我想做的是让图像一路穿过，让用户能够滚动它们…我希望这是有意义的。这是我的密码：

<div id="gallerySet1">
                <img src="images/1.2.jpg">
                <img src="images/1.3.jpg">
                <img src="images/1.4.jpg">
                <img src="images/1.5.jpg">
                <img src="images/1.6.jpg">
                <img src="images/1.7.jpg">
                <img src="images/1.8.jpg">
                <img src="images/1.9.jpg">
                <img src="images/1.10.jpg">
                <img src="images/1.11.jpg">
                <img src="images/1.12.jpg">
            </div>

我正在尝试这样显示我的图像：

---

（单击3幅图像中的一幅）

您需要使用第二个div来包装所有项目（幻灯片也是这样工作的）。如果严格使用css，则需要确保最小宽度==图像的总宽度。如果您想让它更具动态性，您可能需要使用一些JavaScript/jQuery来计算所有图像的宽度，并将

.wrapper

的宽度设置为该宽度（我已经包括了该宽度）

HTML:

jQuery：

$(document).ready(function () {
    var imgs = $('img'),
        width = 0,
        wrapper = $('.wrapper');

    imgs.each(function (index) {
        width += $(this).width();
    });

    wrapper.width(width);
});

---

你的意思是把它们和购物网站中的物品对齐吗？你是说你想让代码＞＞GalErrSeSt1/<代码>有一个水平滚动条吗？是的，对水平滚动BARTIX是我正在尝试做的事情（点击3个图像中的一个），你应该考虑使用这个插件，也许W/E插件正在那个站点上使用。

<div id="gallerySet1">
    <div class="wrapper">
        <img src="http://placekitten.com/300/300">
        <img src="http://placekitten.com/100/300">
        <img src="http://placekitten.com/400/300">
        <img src="http://placekitten.com/240/300">
        <img src="http://placekitten.com/100/300">
        <img src="http://placekitten.com/40/300">
        <img src="http://placekitten.com/300/300">
        <img src="http://placekitten.com/200/300">
        <img src="http://placekitten.com/100/300">
        <img src="http://placekitten.com/200/300">
        <img src="http://placekitten.com/200/300">
    </wrapper>
</div>

#gallerySet1 {
    width: 600px;
    height: 300px;
    overflow-x: scroll;
}
.wrapper {
    min-width: 2200px;
}
.wrapper:after {
    clear: both;
    content:'';
    display: table;
}
img {
    float: left;
}

$(document).ready(function () {
    var imgs = $('img'),
        width = 0,
        wrapper = $('.wrapper');

    imgs.each(function (index) {
        width += $(this).width();
    });

    wrapper.width(width);
});