Search the Community
Showing results for tags 'book'.
Hello I'm going to make a digital book like a flipbook. By looking at the tutorials, I was able to make a typical right-to-left example, but the pages are not as soft as the pages of a real book. https://codesandbox.io/s/flipbook-rtl-k8w8f?file=/src/App.js:845-849
I have an animation on several <divs> or pages which should simulate turning the pages of a book. However, when pages are turned from right to left, the natural order of the <divs> causes the left page to display the first page turned not the last page (as I expected). In the codepen example, I have tried to hide all of the left pages except the current one using a tweenlite.set on both the visibility property and the z-index to no avail. Other than reordering the <divs> which I do not want to do, is there a GSAP method I can use to help solve this issue? One thought I had was to change the float of the left pages to a right float but that did not sound like such a good idea. thanks, James
Using the "Simple 3-D Hover Flip" demo as a starting point, I created the linked codepen. My goal was to create a book where you can flip through the pages by clicking on them. Everything works as I would expect except turning page 1 does not reveal page 2. Any ideas on why it does not display the next <div> in the page stack? Thanks, James