Добрый день! Как можно изменить скрипт горизонтальной прокрутки? А именно избежать использование в стиле свойства white-space. Огромное спасибо за помощь!
var $hor = $("#horizontal");
$("body").css('padding-bottom', $hor[0].scrollLeft = $hor[0].scrollWidth - $hor.outerWidth());
$(window).on('scroll', function () {
var top = $(document).scrollTop();
var width = $hor[0].scrollWidth - $hor.outerWidth();
var lim = $hor.position().top - (width - $hor[0].scrollLeft) - ($(window).height() - $hor.outerHeight()) / 2;
var delta = Math.min(Math.max(top - lim, 0), width);
$hor[0].scrollLeft = width - delta;
$("body").css({'padding-top': delta, 'padding-bottom': width - delta});
});
<style>
#horizontal {
white-space: nowrap;
font-size: 3em;
overflow: hidden;
margin: 0;
}
#horizontal > div {
display: inline-block;
width: 100%;
white-space: normal;
}
</style>
<p></p>
<div id="horizontal">
<div style="background:silver">Как изменить скрипт горизонтальной прокрутки?</div>
<div style="background:antiquewhite">Как изменить скрипт горизонтальной прокрутки?</div>
</div>
<p></p>