jQuery Slider неожиданно прыгает - PullRequest
Новая
       5

jQuery Slider неожиданно прыгает

0 голосов
/ 10 июня 2009

У меня есть этот скрипт: 

<div style="position:relative ;overflow:hidden ; height:195px;">
    <div style="position:absolute" class="scroll">
    {foreach from=$announce_list item=a}
        <div>
        <img src="imgsize.php?w=214&h=100&img=../uploads/announce/{$a.--------}.jpg"  />
        <h4 dir="rtl" style="padding-top:10px; padding-bottom:5px;">{$a.------}</h4>
        <p dir="rtl" style="text-align:justify ;line-height:17px;">{$a.---------|truncate:"300":"..." }</p>
        </div>
    {/foreach}
    </div>
</div>
{literal}
    <script>
        $(function(){
            function change_announce()
            {
                console.log('asdasdasd');
                var Scroll = $('.scroll') ;
                Scroll.children('div:first').animate({marginTop:'-195px' } , 1000 , 
                function(){
                    Scroll.children('div:first').appendTo(Scroll).css('marginTop' , '0px' ).fadeIn(2000); 
                }
                ); 

            }
            setInterval(change_announce , 3000) ;
        });
    </script>
{/literal}

На этой странице в правой панели сайта www.mahestan.ac.ir в этой демонстрации анимация не выполняется полностью после того, как второй div скрыт, следующий div не завершает анимацию и происходит внезапный скачок!

1 Ответ

1 голос
/ 10 июня 2009

ОБНОВЛЕНИЕ: При дальнейшей проверке вашего кода я обнаружил, что причина небольшого скачка. В анимации вы прокручиваете DIV в положение -195px, которое является высотой .scroll div.

Однако вы должны принять во внимание padding-top:10px и padding-bottom:5px. По этой причине вам нужно добавить -15px к номеру в сумме -210px вместо -195px.

Изменить эту строку: 

Scroll.children('div:first').animate({marginTop:'-195px' } , 1000 ,

Кому: 

Scroll.children('div:first').animate({marginTop:'-210px' } , 1000,
...