3D FlipBook - Star with book perspective and in the next pages show the "flat" perspective

b***l@gmail.com
2024-01-10
2024-02-05

Hi, I love the "perspective" view (what I mean: https://i.gyazo.com/55cb180a4acd85454c82a5eaba063849.jpg) but just for the book cover. I'd like to get the next pages with the "flat" perspective (what I mean again: https://i.gyazo.com/41b70edd345af8b574f8e29d06fb1d68.jpg) so how can I get an animation to change between two perspectives depending if the user is in the book cover (1st page) or in the others (2,3,4...) to change the perspective?

As a sum up: show 1 page with perspective and the rest of the book with the flat perspective.

Thanks!

Replies

a***r@3dflipbook.net
2024-02-05
2024-02-05

Hi, for example you can enable pages customization and use this Java Script for first page CSS layer:

function init(jContainer, props) {
  console.log([jContainer, props]);
  console.log('init');
  return { // set of callbacks
    hide: function() {
props.scene.visual.getOrbit().actions.rotate(null, {dx: 0, dy: 100, state: 'move'});
console.log('hide');},
    hidden: function() {console.log('hidden');},
    show: function() {
props.scene.visual.getOrbit().actions.rotate(null, {dx: 0, dy: -100, state: 'move'});
console.log('show');},
    shown: function() {console.log('shown');},
    dispose: function() {console.log('dispose');}
  };
}; init
b***l@gmail.com
2024-02-05
2024-02-05

Hi, thanks for the answer. You mean to paste that code here: https://i.gyazo.com/17b21ae29e18aea95ac696968c0b8086.png ? Unfortunately it isn't working... the book still sees with perspective after the first page. Nothing changed.

If it is useful, Im using an external PDF with the shortcode: [3d-flip-book pdf="www.site.com/example.pdf" book-template="Magic" mode="thumbnail-lightbox"][/3d-flip-book]

Thanks!

a***r@3dflipbook.net
2024-02-08
2024-02-08
b***l@gmail.com
2024-02-08
2024-02-08

Hi,

I really appreciate it BUT it doesn't work with the external URL PDF in the shortcode (pdf="") just with a certain id. I mean:

[3d-flip-book id="2474" ][/3d-flip-book] --> ✅ it works

[3d-flip-book mode="thumbnail-lightbox" pdf="https://mysite.com/fileexample.pdf"][/3d-flip-book] --> ❌ DOESN'T WORK

So how can I do that all my flip books (if they are loaded from external PDF) do that function?

Many thanks!

b***l@gmail.com
2024-02-19
2024-02-19

It is working!

Last thing: how can I deactivate the "smart" corner on the fist page? I want to deactivate the option to click/grab the corner since it ruins the perspective view. But just deactivate in the 1 page. Thanks!

Log In to leave a comment