JQuery Cloud Карусель с вертикальной прокруткой - PullRequest
Новая
       22

JQuery Cloud Карусель с вертикальной прокруткой

0 голосов
/ 20 июля 2011

Я хочу взять облачную карусель профессора Облака на http://www.professorcloud.com/mainsite/carousel.htm и заставить ее прокручиваться по вертикали. Я вижу, что отражения могут быть проблемой с вертикальной прокруткой, и если они в порядке, я могу обойтись без них, я бы хотел включить их, если это возможно. Спасибо за всю твою помощь. (Мне нужно, чтобы он поместился здесь: http://www.inspiritandintruth.com на правой панели.)

Ответы [ 2 ]

1 голос
/ 21 июля 2011

Итак, покопавшись в коде, я наконец-то понял. На случай, если кто-нибудь попытается сделать это на своем собственном сайте, вот что я получил: Примерно в строке 260 неуменьшенной версии у вас есть две строки, подобные этой: 

x = this.xCentre + (( (funcCos(radians) * this.xRadius) - (item.orgWidth*0.5)) * scale);
y = this.yCentre + (( (sinVal * this.yRadius)  ) * scale);

Просто измените их на: 

y = this.yCentre + (( (funcCos(radians) * this.yRadius) - (item.orgWidth*0.5)) * scale);
x = this.xCentre + (( (sinVal * this.xRadius)  ) * scale);

Обратите внимание, как x и y были переключены (3x)

Вам нужно будет возиться с инициализацией, особенно с xPos и ​​xRadius, вот мои конечные результаты: 

$("#bookscroll").CloudCarousel({            
    xPos: 11,
    yPos: 170,
    xRadius: 16,
    yRadius: 170,
    buttonLeft: $("#book-down"),
    buttonRight: $("#book-up"),
    altBox: $("#book-alt"),
    titleBox: $("#book-title"),
    mouseWheel: true,
    bringToFront: true,
    autoRotate: 'left',
    speed: 0.02,
    autoRotateDelay: 4000
});

Надеюсь, это кому-нибудь поможет, вы можете увидеть его в действии (и даже более тщательно настроенном) на http://www.inspiritandintruth.com

1 голос
/ 20 июля 2011

У меня такая же проблема. Я нашел эти два, которые имеют одинаковый эффект 3d и поддерживают вертикальную прокрутку из коробки.

http://www.jacksasylum.eu/ContentFlow/

http://www.bkosborne.com/jquery-waterwheel-carousel

Полагаю, вы могли бы использовать один из них или посмотреть на их код, чтобы увидеть, как они это сделали.

Надеюсь, это поможет.

B

...