Я искал бегущую строку jQuery, хотя это звучит достаточно просто, я не смог найти ни одного рабочего кода, который соответствовал бы моим потребностям.
Мои требования:
- Он должен поддерживать направление (в частности, справа налево).
- Он должен поддерживать использование неупорядоченного списка в качестве источника, а не одной строки.
- Он должен выглядеть как классический шатер.
После поиска я нашел только несколько, которые несколько соответствовали тому, что я искал, но все они имели серьезные недостатки.
Первый — это liScroll, который, хотя и кажется довольно хорошим, не имеет поддержки направления. По умолчанию это просто слева направо, и нет возможности изменить это. И хотя я пытался изменить код для поддержки письма справа налево, увы, я с треском провалился.
Я также попробовал плагин Giva Labs Marquee, но, насколько я могу судить, он также не поддерживает направление.
Последний — [jQuery WebTicker][2], хотя на первый взгляд он казался идеальным, в нем обнаружилась странная ошибка/поведение. Он отлично работает, когда каждый элемент короткий, но в моем случае каждый элемент представляет собой довольно длинную строку сам по себе, и в этом случае он ведет себя хаотично. Когда каждый элемент заканчивается, вместо того, чтобы плавно отображать следующий прямо в хвосте, он вместо этого отображает много пустых мест, и элементы чувствуют, что они прыгают, а не прокручиваются/скользят.
Я понимаю, что многие люди вообще не любят шатры, но уверяю вас, я делаю это не по своей воле. Так что терпите меня.
Заранее спасибо.
Изменить: мне удалось получить simpleScroll (спасибо Серил Уилтинк) по большей части работает, но я столкнулся с небольшой проблемой. Я использую "направление: назад", что означает прокрутку текста слева направо, но проблема в том, что текст начинает прокручиваться с крайнего правого, а не крайне левого положения, что приводит к первому элементу на список не просматривается.
Я взглянул на JS и предполагаю, что проблема заключается в этой части (блок else) [строки со 143 по 162 в исходном JS]
if (this.isAuto && this.o.autoMode=='loop') {
this.$list.css(this.dimension,this.posMax+(this.itemMax*addItems) +'px');
this.posMax += (this.clipMax - this.o.speed);
if (this.isForwards) {
this.$items.slice(0,addItems).clone(true).appendTo(this.$list);
this.resetPosition = 0;
} else {
this.$items.slice(-addItems).clone(true).prependTo(this.$list);
this.resetPosition = this.$items.length * this.itemMax;
//due to inconsistent RTL implementation force back to LTR then fake
if (this.isRTL) {
this.$clip[0].dir = 'ltr';
//based on feedback seems a good idea to force float right
this.$items.css('float','right');
}
}
Но какие бы значения я ни пытался изменить, это заканчивалось тем, что все испортилось, я предполагаю, что это ключевая часть
this.resetPosition = this.$items.length * this.itemMax;
Но любые изменения этих значений в конечном итоге приносят больше вреда, чем пользы. Я вообще работаю в нужном месте? Или проблема может быть где-то совсем в другом?
