Flipping Card Animation Using HTML and CSS

แชร์
ฝัง
  • เผยแพร่เมื่อ 24 พ.ย. 2024

ความคิดเห็น • 38

  • @roba9443
    @roba9443 4 ปีที่แล้ว +4

    Works great. For Chrome 83, add "backface-visibility: hidden;" to the parent ".front,.back" rule as well.

    • @AlexGb007
      @AlexGb007 2 ปีที่แล้ว

      Thank you for this very helpful advice. Solved that weird „glitch“ for me while flipping the card.

  • @AngaarUriakhil
    @AngaarUriakhil 3 ปีที่แล้ว +1

    Clearest video on the topic - thanks!

    • @RyanWebTech1
      @RyanWebTech1  3 ปีที่แล้ว

      Thank you. Glad you found the video helpful.

  • @HabunoGD1821
    @HabunoGD1821 ปีที่แล้ว

    Good Job! Perfect...

  • @ayshbabar
    @ayshbabar 2 ปีที่แล้ว

    Thank you so much Sir! I needed to make this for an assignment, and it works great!

  • @all-eter-4289
    @all-eter-4289 2 ปีที่แล้ว +1

    very clear thanks you!

  • @apan0608
    @apan0608 3 ปีที่แล้ว

    Very good tutorial, adding the position: relative and transform-style to parent has solved the issues I have been scratching my head with!

    • @RyanWebTech1
      @RyanWebTech1  3 ปีที่แล้ว

      Thanks. Glad you found the video helpful.

  • @mohamedyoussef8835
    @mohamedyoussef8835 ปีที่แล้ว

    Awesome video ++++++++++++++++++ 🙂

  • @dharmbharodiya5158
    @dharmbharodiya5158 3 ปีที่แล้ว +2

    This really helped! The way you explain everything is just amazing.

  • @memo_force
    @memo_force 2 ปีที่แล้ว

    nice 👍

  • @messi_codes
    @messi_codes 2 ปีที่แล้ว

    thanks for wonderful video bro

  • @prasadsawant22
    @prasadsawant22 3 ปีที่แล้ว

    I loved your presentation ❤️👍

  • @SvetaSveta-ms4hi
    @SvetaSveta-ms4hi 3 ปีที่แล้ว

    Thanks a billion! ❤️

  • @onthegocode1443
    @onthegocode1443 2 ปีที่แล้ว

    Great tutorial, learned a ton of stuff!!!

  • @rodmejiao7340
    @rodmejiao7340 3 ปีที่แล้ว

    Amazing bro!

  • @kanna6835
    @kanna6835 3 ปีที่แล้ว

    Thank you... for your clear explanation :)

  • @danyquintero3895
    @danyquintero3895 2 ปีที่แล้ว

    Thank you so much Dharm, you explain much better than my professor, hugs from Colombia 🇨🇴🔥

  • @seeker3794
    @seeker3794 ปีที่แล้ว

    Thank you very much.

  • @NamelessG0D
    @NamelessG0D 4 ปีที่แล้ว

    Thanks, very helpful.

  • @Mostafa-ke7hj
    @Mostafa-ke7hj 4 ปีที่แล้ว +1

    thanks very helpful

  • @RajeshThakur-nm3fr
    @RajeshThakur-nm3fr 2 ปีที่แล้ว

    Hello I am not able to give padding inside card. padding is coming out of the card. Please try to explain me asap.

  • @theWorldIsMultivariate
    @theWorldIsMultivariate 3 ปีที่แล้ว

    Thank you so much!!

  • @zakariyaabaouali6904
    @zakariyaabaouali6904 3 ปีที่แล้ว

    thanks bro you help me a lot ❤❤

  • @cawai2815
    @cawai2815 4 ปีที่แล้ว

    Thanks, it would be very useful.

  • @CodingLover1
    @CodingLover1 2 ปีที่แล้ว

    Thanks a lot awesome .

  • @feedgaming8374
    @feedgaming8374 ปีที่แล้ว

    thank u so much

  • @bretts7740
    @bretts7740 4 ปีที่แล้ว

    very helpful!

  • @morgan1827
    @morgan1827 2 ปีที่แล้ว

    if i have 9 card frond and back, how i flip this ?

  • @stefanpfadt4353
    @stefanpfadt4353 2 ปีที่แล้ว

    Hey cool ☺ Any chance to start the flip when you toggle a switch? (e.g. monthly to yearly)

    • @RyanWebTech1
      @RyanWebTech1  2 ปีที่แล้ว

      That's a cool idea. The toggle switch can be implemented using the "checkbox" hack or a few lines of JavaScript.

    • @stefanpfadt4353
      @stefanpfadt4353 2 ปีที่แล้ว

      @@RyanWebTech1 Do you know any good websites where I could find out more about this sort of Javascrip issue? I am not a coder and its quite difficult for me to find the right/good sources ;)

  • @bipinsanghvi7834
    @bipinsanghvi7834 3 ปีที่แล้ว

    Instead of card, how can I use any picture for the same front n back type flip card effect.

    • @hashirmalik9055
      @hashirmalik9055 3 ปีที่แล้ว

      add that picture in div with front and back classes

  • @achimovicidamir2119
    @achimovicidamir2119 3 ปีที่แล้ว

    thanks

  • @Siddh_Galactica
    @Siddh_Galactica 4 ปีที่แล้ว +2

    You copied it from yahoo baba