Изменение высоты слайд-шоу при обновлении с помощью слайд-шоу jquery - PullRequest
Новая
       43

Изменение высоты слайд-шоу при обновлении с помощью слайд-шоу jquery

0 голосов
/ 17 августа 2011

вот интересный для вас всех!

Мои страницы загружают слайд-шоу, сделанные с помощью плагина цикла jquery, абсолютно нормально. Слайд-шоу имеют переменную высоту, поэтому мне пришлось использовать некоторый код, чтобы оценить высоту каждого слайда и соответствующим образом изменить размер оболочки слайд-шоу (поскольку у Chrome возникла проблема)

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

вот пример страницы (пожалуйста, не судите остальную часть моего кода - это просто сайт разработки, я знаю, если нужно очистить !!) - текст внизу (со вставкой soundcloud) изображение немного это зависит от высоты слайда. http://www.frootful.co.uk/index-z.php/?p=7

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

<script type="text/javascript">     
$(document).ready(function() {
    $('#toggle').bind("click", function() {
    if ($(this).attr("class") == "play")
    $(this).attr("class", "pause");
    else
    $(this).attr("class", "play");
}); 
var toggle = $('#toggle').click(function() {
    var paused = slideshow.is(':paused');
    slideshow.cycle(paused ? 'resume' : 'pause', true);
}); 
var slideshow = $('#slideshow').cycle({
        fx:      "fade",
        pager:   "#single-slideshow-nav",
        timeout:  4000,
        prev:    "#prev",
        next:    "#next",
           after: onAfter,
        pause: true
    });
}); 
function onAfter() {
    //get the height of the current slide
    var $ht = $('.slidewrap').height();
    //set the container's height to that of the current slide
    $("#slideshow").height($ht);
} 
</script>

Мой javascript не очень хорош, так что если бы люди могли объяснить ответы, которые были бы вдвойне полезны!

Спасибо

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

добавлен лучший пример страницы (http://www.frootful.co.uk/index-z.php/?p=7),, как уже упоминалось выше, бит текста под ним - это бит, на который влияет высота слайда ...

1 Ответ

0 голосов
/ 17 августа 2011

(На момент ответа.) Ваша страница примера не содержит ни слайдов, ни div с именем toggle.

Ваш JavaScript содержит два блока $(document).ready, каждый из которых пытается настроить щелчок мышью.обработчики для #toggle (даже если этого не существует.) Вы могли бы / должны объединить их в один блок кода.

Я предполагаю, что функции paused и resumed предназначены для возвратазначение, поэтому вам нужно добавить return к ним обоим.(т.е. return !byHover;, если вы это имели в виду)

Что еще?Я думаю, вы могли бы попробовать использовать add / remove / toggleClass вместо манипулирования классами с помощью attr, но я сомневаюсь, что это изменит.

...