Making 95% of your content slide from one side to the other

[N4thyra]

First of all, this is going to be a module for a website eventually – it’s going to be a part of a bigger website. Not a single page itself!

The link is here

It should work this way:

1. when clicked the left arrow: slowly move the entire content from left to right, and replace content of the former div
2. when clicked the right arrow: slowly move the entire content from right to left, and replace content of the former div

If you are still confused, here is a simple JS library that exactly works as I need to though it messes my design, and I can’t use it http://kenwheeler.github.io/slick/

Anything that is inside this div will be dynamically changed

<div class="news-body">
    ************
</div>

Right now, when an arrow is clicked, it only moves a particular box in the middle, which isn’t a big deal to fix, but what’s the best way to dynamically change the entire content of my div without doing something like this:

When an arrow clicked change the entire HTML body to
https://pastebin.com/UfbvGTgz

[owel]

You can use the Carousel feature of Bootstrap for this.

You can even modify the CSS so instead of sliding, it will fade out from one to the next.

[N4thyra]

Alright. I really didn’t intend to re-write my code, but I could give it a try. It may eventually be simpler than I think. Thanks for the tip.