Issue: Horizontal Scrolling Effect With Skrollr

I want to create an horizontal animation controlled by the skrollr. Scrolling down, the elements of my page have to move from left to right of my container. Assuming that my elemen

Solution 1:

Just set the widths to 100% and contain your images within:

#container {
    background-color:black;
    width:100%;   
    height:300px;
    overflow:hidden;
}
div {
   position:fixed;
}
.bg {
    width:100%; 
    height:300px; 
}

Here's a Demo in Fiddle

Solution 2:

I don't see how the different width would be a problem. You could set all width to 100% and overflow: hidden; or use jQuery to check the best way to fit the image in the container.