jQuery минусовое заполнение при анимации левого значения? Странный - PullRequest
1 голос
/ 20 октября 2010

Я работал над слайдером, используя неупорядоченный список. Стандартная структура, пример (не тот код, который я использую):

<div style="overflow: hidden;width: 500px;padding: 20px;position: relative">
    <ul style="width: 1000px;position: relative;padding: 0;margin: 0;list-style: none;">
    <li style="width: 500px;padding: 0;margin: 0;float: left;"></li>
    <li style="width: 500px;padding: 0;margin: 0;float: left;"></li>
    </ul>
</div>

с использованием li ширины 500px и отступа div 20px плюс ширина 500px, например. И некоторые jQuery, такие как:

$(div ul).animate({left: position.left-500+"px"});

Я случайно заметил по своей ошибке, что jQuery при скольжении только влево ul будет сдвигать 460px в этом случае. Кажется, это автоматически убирает отступы? И поэтому слайд <ul> выключается каждый раз.

Любое объяснение, почему это происходит?

Ответы [ 3 ]

1 голос
/ 20 октября 2010

Я попробовал это и работает дальше:

либо измените положение ul на абсолютное

или одушевленный как $('ul').animate({left: '-=520'+"px"}

20px добавлено только в опере, т. Е. Ff '- = 500' работает как положено с относительной позицией

это мой тестовый код

    <div style="overflow: hidden;width: 500px;padding: 20px;position: relative;background-color: black;">
<ul style="width: 1500px;position: relative;padding: 0;  margin: 0;list-style: none; ">
<li style="width: 500px;padding: 0;margin: 0;float: left; background-color: blue;">-</li>
<li style="width: 500px;padding: 0;margin: 0;float: left;background-color: red;">-</li>
<li style="width: 500px;padding: 0;margin: 0;float: left;background-color: green;">-</li> 
</ul>
</div>  

 <script  type="text/javascript">
 $(document).ready(function(){
// $('ul').animate({left: '-=20'+"px"});       
 $('ul').animate({left: '-=500'+"px"});
 $('ul').animate({left: '-=500'+"px"});    

 })
</script>
0 голосов
/ 20 октября 2010

При первом вычитании из ширины отступы 20px влево + 20px вправо = 40px, то есть 460px.

Заполнение объединяется с шириной элемента. Если вы удалите отступ или увеличите ширину, это должноЭто.С наилучшими пожеланиями

0 голосов
/ 20 октября 2010

Я полагаю, что скольжение не ценит дополнения родителя.Обратите внимание, что вещь, которую вы скользите, ul, вообще не имеет отступов.

Попробуйте установить отступы на ul, а не на контейнер.

...