Javascript jQuery：水平滚动到div

我最终的目标是在类似于bbc网站的地方实现：从一节到另一节进行侧滚。这是我的代码，我将解释我面临的问题：
jsFiddle:
HTML:

首先，我不知道是否可以将

.contentContainer

div堆叠在一起，而不必在

.container

div上设置300%的宽度。由于站点将是CMS，我不想继续更改

.container

div的宽度以适应。一次视图中也只有一个

.contentContainer

div，因此我将溢出设置为隐藏。

---

我似乎也想不出一个好的滚动函数，我目前只有一个滚动

.container

div一次100%，理想情况下我希望它更像一个幻灯片，如有可能，在循环中。如有任何建议，将不胜感激

我已经更新了你的。使用下面的代码，您可以计算滑块中的元素数量，然后自动设置%宽度

var length = $('div .container').children('div .contentContainer').length;
$(".container").width(length*100 +'%');

---

为什么不使用滑块插件呢？你甚至可以。我在这里回答了类似的问题：

$(document).ready(function () {
    $('.right').click(function () {
        $('.container').animate({
            'left': '-100%'
        });
    });
    $('.left').click(function () {
        $('.container').animate({
            'left': '0%'
        });
    });    
});

var length = $('div .container').children('div .contentContainer').length;
$(".container").width(length*100 +'%');