The simplicity of your logic is truly genius. It takes a great mind to code like that. Thank you tremendously
@hugocangi6214Ай бұрын
HELLO FRIEND, I JUST FINISHED THE FLIP BOOK SINCE YESTERDAY, I THANK YOU A LOT, YOU EXPLAIN VERY WELL I EMAIL TO FOLLOW YOU GREETINGS GOOD WEEKEND
@tsheposepadile2 жыл бұрын
One of the best tutorials I've ever seen. You made it so easy to follow along. Thank you. 🙏
@turniponabike3 жыл бұрын
You did it!!! This is amazing and creative. I'm so glad you made this. I've been wanting to do a book for a long time but I could not come up with everything you did here. Now I am going to do my children's book with this. Thank you Coding Star!
@codingstar82273 жыл бұрын
I really enjoyed creating this project. Thanks Turnip for the awesome idea! Hope this video helps 😃
@9-volt2479 ай бұрын
@@codingstar8227 Why do you rarely comment?
@jonathanel-aziz7708 Жыл бұрын
Nice! Tried this for a magazine and so easy, the problem is to make it responsive.
@MyStudio-io3so Жыл бұрын
Turn.js is a better choice. The pages turn like a real magazine. Not stiff and robotic.
@xxc-j1l24 күн бұрын
i very like your lecturing style
@vladimirtravkin49583 ай бұрын
Many thanks for the detailed lesson. This is one of the best tutorials on this topic. I will be waiting for your new lessons. Thanks again!
@clarkjeans22212 жыл бұрын
(I am not good at English.) - I didn't try your awesome code yet, but it looks like it will work. I wanted good example or code for flip book, but I can't search that well. But your guide is perfect for me!! Thank you so much, I hope your subs get higher. Have a nice nice nice day!
@nizambao4653 Жыл бұрын
Thank you so much for this video.
@kimsy5202 жыл бұрын
Thank you! I can’t wait to create my writing prompts book with this 😀
@just_uriht Жыл бұрын
Great content!!! Explained very well! As a beginner I find this super super useful!!!
@BersediaBelajar5 ай бұрын
❤Yesss...Great Content... Thank you so much for your tutorial...
@ckasprojects-fk8hv26 күн бұрын
This is Really awesome, thanks for this tutorial, it worked like a sharm 🙂💯
@soumelee56614 ай бұрын
You explain so well! you are very good teacher.
@hirokonara_ Жыл бұрын
I cant flip it :(
@WizInsight1082 жыл бұрын
Thank you so much for the tutorial.
@lightyear3429 Жыл бұрын
You never asked to like & subscribe, yet I'm sure many would do regardless, including myself. It's very rare to see a tutorial that good. The only thing I didn't understand is what translateX(0%) is doing - I would think it moves along the X axis at 0%, meaning doesn't move the div at all...
@mvnk0012 күн бұрын
thanks ❤❤
@sagniksaha41793 жыл бұрын
you got a new subscriber . Awesome man great work
@codingstar82273 жыл бұрын
Thank you! :)
@uzma81985Ай бұрын
it seems pretty easy:BTW:where did u make ur code?which platform?
@CV-ec6mk3 жыл бұрын
awesome job man thanks for sharing
@codingstar82273 жыл бұрын
Thank you!
@sally80213 жыл бұрын
that's so good, thank you so much, it's really helpful
@codingstar82273 жыл бұрын
Glad it helped :) I'll upload more useful videos in the future!
@Goldenknowledgeforyou2 жыл бұрын
Thank You 😃😃😃😃😃
@deepwebtv3 жыл бұрын
good looking. keep growing!
@codingstar82273 жыл бұрын
Thank you 😆
@lucasjustable3 жыл бұрын
Great video!!!
@codingstar82273 жыл бұрын
Thank Lucas♡
@nafeysolutions48082 жыл бұрын
Love this book. .. you gave something for free .. which is sold for tens of dollars
@miscetc-tm2yt2 ай бұрын
How is your mouse doing that? All operating systems should have that mouse feature by default.
@elenalouka28013 жыл бұрын
Great work! Thanks so much! I coudnt find anything as useful as that!
@codingstar82273 жыл бұрын
Thanks Elena for your kind comment! Hope this helped 😃
@mr.click_bate9944 Жыл бұрын
How do I add more pages?
@l--db8uh2 жыл бұрын
great, you just gain another follower😁
@katepopza2 жыл бұрын
this is very good content, thank you so much
@katepopza2 жыл бұрын
so if i have 3 menu flip i tried it and it didn't work
@tempowong47182 жыл бұрын
Any idea to make it to be responsive? I got trouble on the context (T_T)
@smileilunga28202 жыл бұрын
I would really love to do this but I’m worried about responsiveness
@MicroDobb5 ай бұрын
Thank you, Sir! Can you help with a question - how I can do any button for example on page 1 to page 3 or backward. Thank you!
@sejauhperjalanan75633 жыл бұрын
How to flip UP?
@codingstar82273 жыл бұрын
The flip animation is done by using CSS. To flip up and down, you should think about tweaking the "transform" and the "transform-origin" properties of the pages (also the layouts of the button should be adjusted as well). I would start with setting "transform-origin: top;" and "transform: rotateY(some angle)".
@vedantagarwal52688 ай бұрын
hi when I added more pages, during the transition the next page is appearing before the full transition is over. how can i delay this
@maxcortezkubelka17443 жыл бұрын
Woooow, I have a problem, when I add more pages, when I put the next page, the images stay static for a few seconds and lose all the magic, how can I fix it?
@codingstar82273 жыл бұрын
Hey Max! When you add more page (add another page in the HTML), make sure to modify css and javascript accordingly. I will soon provide you with the source code which has 1 more page added to it.
@codingstar82273 жыл бұрын
I created a new Github Repository for the source code with an extra page added. You can view it here: github.com/codingstar-jason/3D-fip-book-tutorial-extra-page/tree/main
@maxcortezkubelka17443 жыл бұрын
@@codingstar8227 Thank you so much Crack...!!!
@user-js9hu4og9m11 ай бұрын
hi , i was wondering what is your chrome extention, i see that you can create shapes ( squares and rectangles) when "selecting" and it has color !
@AdewaleLords-Favour5 ай бұрын
@coding star Thank you for this tutorial but I need your help, I used the code, but there is an error, the last front page does not respond to hover nor does the cursor change to indicate it is a text unlike the others, and it actually looks like the page os not interactive at all, please how can I fix this?
@innovaebruno15002 жыл бұрын
Brazil loves you
@SohaibZaman5 ай бұрын
I am new to js.. can any one plz tell me why we started cases from 2 instead of 1 in goPrevPage function??
@yolandaxing9827 Жыл бұрын
thank you so much for the tutorial! is it possible to make it compatible to a phone size as well?
@gevorgnersesyan49046 ай бұрын
Hello, thank you for this amazing video. But I couln't make it to work. I think soemthing was changed in commands during these years. Can you help me to figure out the problem? Thanx
@matt3g8632 жыл бұрын
Hey would you recommend this method if you are doing a book with more than 20 pages?
@_tech_js Жыл бұрын
Yes, he is right please can you tell
@lightyear3429 Жыл бұрын
For a book like that, add a form somewhere at the bottom - to enter the number of current page
@matt3g863 Жыл бұрын
@@lightyear3429 okay 👍🏾
@DiyintheGhetto7 ай бұрын
Hello, Is it possible to do the same way but with pages. How you can flip it like a book?
@_tech_js Жыл бұрын
Thank you so much. But I want it for more than 20 pages than how to do that
@georgeseletski8241 Жыл бұрын
how to make pages soft as in magazines ?
@Adnan_19946 Жыл бұрын
how do i make it responsive so that it turns to a scrolling book at mobile sizes
@eliranbramli2 жыл бұрын
I cannot add input to page three. Can you help me?
@jerrym2mmh2 жыл бұрын
hey you miss closeBook(false) function in goNextPage in video but it contain source code however thank for this tutorial.
@deepwebtv3 жыл бұрын
Hey quick question, I was wondering if there was any tips you could give to make the page fit better on a mobile device. I know that is supposed to do the job, but it doesn't. I'm trying to mess around with the CSS to figure it out. Any tips would really help me. Thank you again for this.
@codingstar82273 жыл бұрын
Good question :). You can add "media queries" in CSS to change css properties depending on the width of the screen. Adding media queries will add responsiveness to your website making the css dimensions change according to the size of the screen. I recommend you to have a look at my another tutorial on "responsive navbar". This is will give you some idea how to apply media query 😁. Link: kzbin.info/www/bejne/Z4TOYmB3bbNlf9k
@haroonqadir3474 Жыл бұрын
How do we add images to it
@alisonmak21472 жыл бұрын
It's been awesome following through your video with coding, but just quick question, I'm not sure why I'm receiving a ESLint parsing error: The keyword 'const' is reserved, is there a way to fix this?
@sneakyosrs Жыл бұрын
hello tysm for the tutorial! is this responsive?
@_nitinjayprakashdlmn39382 жыл бұрын
Which screen recorder ?
@azamikromy22512 жыл бұрын
How to add new papers?,im beginers
@adeleyda2 жыл бұрын
hello, i was trying to put in images using but it doesnt work, is there any solutions?🙏🏻
@anime-break Жыл бұрын
Yeah I have aslo tried but didn't working,, image are not changing position with the transform
@11tpsantostimothyphil317 ай бұрын
For me only the first front page can support images. The other pages won't show them no matter what type I use.
@heidip.h.nikolaisen62492 жыл бұрын
really helpful !! is there a way to adjust the orientation of the page to landscape?
@divijgogia8479 Жыл бұрын
in body css just do transform: rotateY(90deg);
@techcodEN2 жыл бұрын
where to write codes?
@glockenblumeglockchen77895 ай бұрын
You didn't say or show where you set the value of the parameter isAtBeginning. Firstly I completely missed this piece of information and had to look for the bug ... 😂
@medprogramming51112 жыл бұрын
My isAtBiginning not function 😢
@arkatanukundu_1712 жыл бұрын
can you make this same thing as a react project?..facing a lot of difficulties while making it in react js
@mnuiozasde9569 Жыл бұрын
@Arkatanu Kundu_1 have you been able to do this in react js?
@m621493 жыл бұрын
how to create view flipbook from pdf file?
@codingstar82273 жыл бұрын
There can be multiple ways of embedding pdf into the flip book. I would recommend converting each page into a JPG image and inserting each image into the flip book using the tag. You can then style the image to fit in the book (or change the dimensions of the flip book). There are lots of online tools you can use to convert them into JPG files. 😃
@aydesignart5 ай бұрын
@@codingstar8227 Please show us how to do this!
@tarunvakkalagadda18772 жыл бұрын
I am a beginner with HTML, CSS and JavaScript. So can someone please explain how to add more pages because I am struggling .
@jonathanel-aziz7708 Жыл бұрын
He have a new repository with an extra page in gitub
@Nicolas_Echavarria Жыл бұрын
Ty bro 👍
@dxt01742 жыл бұрын
I tried your code but in my case the animatiom its not working. I dont know why. Help?
@techcodEN2 жыл бұрын
where to write codes?
@sapphire59393 жыл бұрын
hi can you please make responsive single full page flip animation with prev and next button
@codingstar82273 жыл бұрын
Hi Sapphire, thanks for the idea :)
@prachi-mane2 жыл бұрын
Very nice but Please make it responsive.
@findingidentity2 жыл бұрын
can you let me know the application you used to create this