HTML zmiana kontentu strony bez przeładowania

Question

Witam, mam taki problem bo potrzebuję coś w stylu slidera, tylko, że zamiast samych obrazków jeszcze potrzebna jest treść. Obrazkowo przedstawie o co chodzi:

Mamy tutaj taką strone onepage i tam jest selekcja z obrazkiem tytułem i jakąś treścia, pod tym wszystkim znajdują się dwa przciski:

po kliknięciu button right div ".box" zostaje "wypchnięty poza ekran i na jego miejsce wchodzi drugi 

 

 

 

Po kliknięciu button.left dzieje sie to samo tylko w drugą strone. Takie działanie można zobaczyc na wielu stronach pierwszy lepszy przyklad to facebook. Jak to działa i jak takie coś można zrobić? 

Answer 1

http://www.fasw.ws/faswwp/non-jquery-page-transitions-lightweight/ ?

Comments

No coś w tym stylu, ale zmieniać ma się tylko div.box reszta strony nienaruszona.

---

Skoro tylko do jednego diva, to może użyj faktycznie jakiegoś slidera?

---

A gdyby się bawić transition-x pomieszać css z javascriptem to efekt by byl lepszy niz używanie specialnego slidera?

---

Może być.

---

A zawartość dwóch divów w kodzie HTML czy lepiej przy zmianie ten kod dodawać javascriptem.  Trochę bałagan w kodzie się zrobi gdy będą dwa divy a jednego "nie widac"

---

Czemu bałagan w kodzie? Treść powinna być w kodzie HTML. Natomiast ukrywanie jej przez JS.

---

Przy użyciu transform ciągle obiekt tak jakby "zajmuje" stare miejsce.

---

Hm?

---

Jednak nie działa zbytnio. Tutaj codepen: http://codepen.io/FoxCode/pen/wWNgQk