Фиксирование многострочной нагрузки с помощью smoothdivscroll

Question

В настоящее время я использую smoothdivscroll в сочетании со смешанными классами переменной ширины - то, на что он фактически не настроен (он любит, чтобы все классы были фиксированными, но с добавленным кодом пробела, кажется, работает в основном нормально.

Проблема, с которой я сталкиваюсь, заключается в том, что, пока страница загружает контент, он размещает divs вертикально над собой, а затем правильно отображает их, когда все загружается. пример:

http://www.betweenmanandbeast.com/bmb_om

Я понимаю, что это не совсем то, что вилка в которой предполагается сделать - но он почти работает правильно (если все были на 100mb линиях это было бы хорошо!), я получаю ощущение, что он просто нуждается в небольшом дополнительном коде где-то.

Вот jsfiddle для кода:

http://jsfiddle.net/wnD3r

Также стоит упомянуть, что, когда это единый авто-ширина пост (например, если вы нажмете на «блог»), все это остается на одна строка при загрузке, что означает, что он правильно вычисляет один класс автоширины, а не когда на странице несколько. Код для инициализации:

$("#content").smoothDivScroll({ 
    mousewheelScrolling: "allDirections", 
    manualContinuousScrolling: true, 
    autoScrollingMode: "onStart", 
    hiddenOnStart: false 
    }); 

Любые идеи?

Большое спасибо заранее!

Answer 1

Я не уверен на 100%, я понимаю проблему, но Smooth Div Scroll должен знать ширину каждого элемента в скроллере, чтобы иметь возможность установить общую ширину прокручиваемой области. Он делает это, итерируя все элементы внутри скроллера, добавляя ширину каждого элемента к объединенной ширине всех элементов.

Если у вас всегда будут фиксированные ширины элементов, установленные в вашей разметке (указанные в CSS или даже как атрибуты в тегах HTML, как вы можете делать с изображениями), Smooth Div Scroll не будет иметь проблем с вычислением общей ширины всех элементов до загрузки фактического содержимого скроллера. Это означает, что я могу установить общую ширину прокручиваемой области в событии jQuery $ (document) .ready.

Но проблема в том, что многие пользователи не устанавливают ширину для своего контента, и иногда они не могут указывать ширину, поскольку контент динамически или загружается через AJAX в некотором роде, поэтому ширина элемента не является известных заранее. Поэтому Smooth Div Scroll ожидает, пока содержимое загрузится (встречается в $ (window) .load), прежде чем попытается вычислить общую ширину всех элементов внутри прокручиваемой области.

Итак, это фон относительно того, как Smooth Div Scroll загружает контент сегодня. Если в этом есть что-то, что, по вашему мнению, можно было бы сделать более эффективно или по-другому, я бы хотел услышать об этом, потому что вычисление ширины - это то, о чем я задаю много вопросов.

Answer 2

спасибо, что ответили на это, и за отличный плагин, который позволил мне сделать что-то, чего я не смог добиться ни с чем другим!

Для дальнейшего описания проблемы - при нажатии первой ссылки вы видите многострочную нагрузку (до загрузки всего содержимого)? Если нет, я могу попробовать и создать другой пример.

С точки зрения того, как плагин вычисляет ширину; Я полностью понимаю, почему он действует так, как он делает, и я не знаю достаточно JS, чтобы иметь возможность лично предложить решение, однако есть несколько вещей - например, можно ли установить ширину темпа на что-то вроде 9999, поэтому, пока плагин суммирует ширину, контент не нарушает линию?

Я на самом деле пробовал это, изменив значение с 0 до 9999, но на самом деле это не повлияло, может быть, ему нужно что-то другое изменить для работы?

Answer 3

Вы должны иметь возможность установить ширину области прокрутки в любую ширину в CSS, а затем она будет переопределена атрибутом встроенного стиля, определяющим ширину, когда будет рассчитана общая ширина всех элементов. Что-то вроде этого:

div.scrollableArea 
{ 
    position: relative; 
    width: 9999px; 
    height: 100%; 
} 

Вы также можете попробовать работать с переполнением: скрытый прикладывается к скроллера и сделать это просто так высоко, что только один элемент виден. Тогда не важно, чтобы элементы располагались вертикально до того, как все содержимое загрузилось, и их ширина была рассчитана.

Конечно, это только предложения - я сам их не пробовал.