Плавные переходы между DIV

Заюзать какой-нибудь jQuery плагин, вроде этого, тысячи их! Ну или подсмотреть, как это сделано на ласт.фм или том же тумблере, и попытаться повторить :)

Я копал код...там чет все муторно. фреймворк prototype и вообще не видно как идет работа..там местами защифровано и нечитаемо Мне бы понятный код как сделать..

Если на Prototype и не хочешь тянуть jQuery, используй script.aculo.us (это аддон к нему).

Вот примерно то, что тебе нужно.

А на jquery ток чет я не могу понять как это все таки сделать) Там пример перелистывания картинок...а вот стена...

Какая ещё стена?

Это кстати, несложно слепить и самому, на ванильном JS. Делаешь горизонтальный список из элементов одинакового размера, они будут служить обёртками для контента. Помещаешь список в див, размер которого равен размеру элементов, ставишь position: relative. Потом при нажатии на кнопку плавненько меняешь left у списка в меньшую или большую сторону. Вот и всё, кажется.

Мм можно в виде маленького кода? Я просто на js достаточно мало пишу... Должна в общем образоваться стена. Слева DIV 30% справа DIV и при нажатии на стрелочку левый DIV как бы выезжает до конца и правый уходит совсем. И образуется короче что левый DIV на экране становится правым а слева появляется еще один большой DIV тоже самое наоборот + полное убирание меньшего дива чтобы тот большой правый был на весь экран.

Короче DIV1(80%)|DIV2(20%)|DIV3(80%) Надо сделать слева и справа кнопочки чтобы перемещаться по этой стене и подгружать через ajax и т.д. если нужно ну это я сам. И надо чтобы можно было DIV3 на весь развернуть. Дай мне хоть код перехода от DIV2(20%)|DIV3(80%) к DIV1(80%)|DIV2(20%) со всеми css дальше сам разберусь.

А что должно происходить с содержимым дива при переходе от 80 % к 30 %?

Если в нём только картинка, то всё просто — меняется размер. Плагин Moving Boxes как раз это и реализует. А если текст или ещё что — какое ожидается поведение?

Кстати на глагне тумблера, на который ты ссылался, всё происходит несколько иначе: там один див в каждый момент времени.

В этих дивах и текст и картинки и другие элементы. Нужно достичь эффекта как будто это стена и просто переходит просмотр частей

Если я правильно понял, то как-то так.

в общем почти так, только эти див на весь экран и они 1 из 3 уходит полностью. Завтра посмотрю если не разберусь напишу. Спасибо огромное!

только вот совсем не нужно изменение размеров и они должны как бы быть слитны. То есть примерно такие столбики синий(30%) зеленый(70%) жмем влево у нас красный(70%) синий(30%) жмем вправо синий(30%) зеленый(70%) еще раз вправо зеленый(100%) Вот.

Если на весь экран, то размеры дива заранее неизвестны и надо чисто на js делать, этот способ не катит. У них ширина-то хоть одинаковая?

в js вроде можно узнать текущую ширину области экрана. Можно 1024 взять к примеру короче 1 819 2 205 3 819 можно право можно влево а если мы уже до упора дошли то крайний див с той стороны где мы находимся увеличивается до 1024 плавно смещая другой див в обратную сторону.

И вот еще..как это можно сделать на примере верстки DIV используя Table?

<div class="grid">
  <div class="row">
    <div class="element1">
      Text
    </div>
    <div class="element2">
      Text
    </div>
  </div>
  </div>
</div>

.grid {
  display: table;
  border-spacing: 4px;
}
.row {
  display: table-row;
}
.element1 {
  display: table-cell;
  width: 240px;
  vertical-align: top;
  text-align: center;
}
.element2 {
  display: table-cell;
  width: 784px;
  vertical-align: top;
  text-align: center;
}

http://pastebin.com/2HvT8iHS Вот посмотри что надо примерно. Только вот когда она едет слева зеленая область должна остаться пренего размера(то есть маленького) а синяя должна быть такой же большой как и красная. То есть надо сделать сдвиг на 780px

Поможешь?

Что-то я всё равно не втыкаю: первое положение — широкаяая красная/узкая зелёная, второе — широкая зелёная/узкая синяя, так? Какое третье?

Если ты развернёшь див во всю клиентскую область по высоте и установишь display:table-cell, то задать 100 % height для вложенного дива так просто не получится, только если в скроете выставлять — я это имел в виду.

Первое зеленый 30% синий 70% теперь или жмем влево получаем красный 70% зеленый 30% или жмем вправо и у нас синий разворачивается на 100% То есть мне надо реализовать сдвиг всех дивов на 70%. В итоге если все их показать то выходит стена на красный70зеленый30синий70 Вот.

http://themeforest.s3.amazonaws.com/116_parallax/tutorial-source-files/tut-in... очень похоже на то что нужно мне. даже похоже оно. И сдвиг задать можно. Посмотрю что там можно сделать.