Как говорил Борис Моисеев "первый раз - не ..., а 5 см - не считается".
...без javascript на чистом HTML...не получается, хотя было бы не плохо.
(function($){
$( ".sl-container" ).each(function() {
var $container = $(this),
$dragMe = $container.find(".dragme"),
$viewAfter = $container.find(".view-after");
$dragMe.draggable({
containment: "parent",
drag: function() {
$viewAfter.css({
width : parseFloat($(this).css('left')) + 5
});
}
});
$container.on("click", function(event) {
var eventLeft = event.pageX - $container.offset().left - 15;
animateTo(eventLeft);
});
animateTo("50%");
function animateTo(_left) {
$dragMe.animate({
left: _left
}, 'slow', 'linear');
$viewAfter.animate({
width: _left
}, 'slow', 'linear');
}
});
})(jQuery);