Плагин jQuery "цикл" вызывает контент не в центре, как я могу это исправить?

Question

Я пытаюсь использовать плагин «Цикл jQuery» (http://jquery.malsup.com/cycle/), чтобы повернуть отзывы, расположенные в <span>S ... Однако плагин вызывает мой контент не быть центрирован. Вчера утро кто-то здесь указал <span> Элементы абсолютно расположены плагином: $slides.css({position: 'absolute', top:0, left:0}).hide()

Я не знаю JS, и я все еще работаю над своим HTML / CSS, поэтому я надеялся, что кто-то здесь знал починить для этого и мог мне помочь. Если нет, ну хорошо: /

Я пытался добавить left:50% И хотя он центры, слайд сломан и все мои <span>S появляются одновременно.

Редактировать

Вот HTML & CSS:

<div class="slideshow">
<span style="font-size:12px; color:#333333; font-family:Lucida Grande,Lucida Sans Unicode,Calibri,Arial,sans-serif;">Hi</span>
<span style="font-size:12px; color:#333333; font-family:Lucida Grande,Lucida Sans Unicode,Calibri,Arial,sans-serif;">Goodbye</span>
</div><br />

.slideshow {
width:940px;
height:64px;
text-align:center;
background-image:url(../images/quotes.png);
}

Один, все работает как планируется. Затем добавляю плагин jQuery / Cycle:

// set position and zIndex on all the slides
    $slides.css({position: 'absolute', top:0, left:0}).hide().each(function(i) {
        var z;
        if (opts.backwards)
            z = first ? i <= first ? els.length + (i-first) : first-i : els.length-i;
        else
            z = first ? i >= first ? els.length - (i-first) : first-i : els.length-i;
        $(this).css('z-index', z)
    });

Это то, что все это винты. Как есть, <span> s показан один за раз, и выцветает, как будто они должны, за исключением того, что текст больше не сосредоточен из-за абсолютного позиционирования. Так что я изменил left:0 к left:50% - wha la! Решающий задача текста сосредоточен, за исключением того, что теперь промежутки все время отображаются одновременно и нет ввода / выезда.

Answer 1

Без кода это не легко позвонить, но я предполагаю, что отзывы находятся в пределах блочного элемента некоторой. Если вы применяете position:relative к этому элементу абсолютно позиционированный <span>S будет содержаться внутри. Вы не должны на самом деле применять какие-либо стили позиционирования на самих промежуток - скорее оставьте это на плагин.

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

---

РЕДАКТИРОВАТЬ

Хорошо, попробуйте это:

.slideshow {
    width:940px;
    height:64px;
    background-image:url(../images/quotes.png);
    position:relative;
    }

.slideshow span {
    display:block;
    }

Вам может потребоваться вручную настроить ширину <spans>S, а также соответствовать ширине div.slideshow