Обратное направление вертикального тикера новостей
Я сделал следующую скрипку в качестве примера: http://jsfiddle.net/GR7pg/ но мне нужно, чтобы она двигалась вниз, а не вверх.
В основном, что случилось, я сделал все это в течение нескольких недель, а затем, когда я доставил клиенту, они теперь хотят, чтобы тикер двигался вниз, а не вверх.
Я смог заставить верхний предмет двигаться вниз, а затем исчезать, но затем остальные предметы все еще двигались вверх. Кто-то, кто более знаком с jquery, может легко изменить это, я надеюсь? Но я попробовал все виды настроек, которые привели к странному поведению.
Любая помощь с благодарностью! Спасибо
(function ($) {
$.fn.extend({
vscroller: function (options) {
var settings = $.extend({ speed: 1000, stay: 4000, newsfeed: '', cache: true }, options);
return this.each(function () {
var interval = null;
var mouseIn = false;
var totalElements;
var isScrolling = false;
var h;
var t;
var wrapper = $('.news-wrapper');
var newsContents = $('.news-contents');
var i = 0;
totalElements = $.find('.news').length;
h = parseFloat($('.news:eq(0)').outerHeight());
$('.news', wrapper).each(function () {
$(this).css({ top: i++ * h });
});
t = (totalElements - 1) * h;
newsContents.mouseenter(function () {
mouseIn = true;
if (!isScrolling) {
$('.news').stop(true, false);
clearTimeout(interval);
}
});
newsContents.mouseleave(function () {
mouseIn = false;
interval = setTimeout(scroll, settings.stay);
});
interval = setTimeout(scroll, 1);
function scroll() {
if (!mouseIn && !isScrolling) {
isScrolling = true;
$('.news:eq(0)').stop(true, false).animate({ top: -h }, settings.speed, function () {
clearTimeout(interval);
var current = $('.news:eq(0)').clone(true);
current.css({ top: t });
$('.news-contents').append(current);
$('.news:eq(0)').remove();
isScrolling = false;
interval = setTimeout(scroll, settings.stay);
});
$('.news:gt(0)').stop(true, false).animate({ top: '-=' + h }, settings.speed);
}
}
});
}
});
})(jQuery);
1 ответ
Это в основном состоит из изменения некоторых из top
с bottom
s и изменение приращений на уменьшение и т. д.
Это должно сделать это http://jsfiddle.net/GR7pg/16/