Dojo fiddle

This JSFiddle is configured and ready to use for testing the Dojo framework.

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/dojo/1.9.1/dijit/themes/claro/claro.css">
<div class="scroll">
    <div class="container">
        <div class="element element-1">1</div>
        <div class="element element-2">2</div>
        <div class="element element-3">3</div>
        <div class="element element-4">4</div>
        <div class="element element-5">5</div>
        <div class="element element-6">6</div>
    </div>
</div>

CSS

.element {
    width: 30px;
    height: 30px;
    float: left;
}

.element-1 {
    background-color: red;
}

.element-2 {
    background-color: orange;
}

.element-3 {
    background-color: yellow;
}

.element-4 {
    background-color: green;
}

.element-5 {
    background-color: blue;
}

.element-6 {
    background-color: purple
}

.container {
    width: 180px;
    height: auto;
}

.scroll {
    width: 90px;
    overflow-x: scroll;
}

JavaScript

require(["dojo/query", "dojo/dom-construct", "dojo/NodeList-dom", "dojo/domReady!"], function(query, domConstruct) {
    var lastPos;
    query(".scroll").on("scroll", function(evt) {
        if (lastPos && lastPos - evt.target.scrollLeft > 0) {
            query(".element").reverse().forEach(function(elem) {
                if (isRightOfContainer(elem)) {
                    var width = elem.getBoundingClientRect().width;
                    domConstruct.place(elem, elem.parentNode, "first");
                    elem.parentNode.parentNode.scrollLeft += width;
                }
            });
        } else if (lastPos && lastPos - evt.target.scrollLeft < 0) {
            query(".element").forEach(function(elem) {
                if (isLeftOfContainer(elem)) {
                    var width = elem.getBoundingClientRect().width;
                    domConstruct.place(elem, elem.parentNode, "last");
                    elem.parentNode.parentNode.scrollLeft -= width;
                }
            });      
        }            
        
        lastPos = evt.target.scrollLeft;
    });
    
    var isLeftOfContainer = function(element) {
        var bounds = element.getBoundingClientRect();
        return (-bounds.left + element.parentNode.offsetLeft) >= bounds.width;
    };
    
    var isRightOfContainer = function(element) {
        var bounds = element.getBoundingClientRect();
        var box = element.parentNode.parentNode.getBoundingClientRect();
        return bounds.left - element.parentNode.offsetLeft > box.width;
    };
});