I am a Pro user but cant use flipping cards !!

web
mobile

Topic: I am a Pro user but cant use flipping cards !!

maani.ahmad99 pro asked 2 years ago

<!-- Rotating card --> <div class="card-wrapper"> <div id="card-1" class="card-rotating effect__click text-center h-100 w-100"> <!-- Front Side --> <div class="face front"> <!-- Image--> <div class="card-up"> <img class="card-img-top" src="https://mdbootstrap.com/img/Photos/Others/photo7.jpg" alt="Image with a photo of clouds."> </div> <!-- Avatar --> <div class="avatar mx-auto white"><img src="https://mdbootstrap.com/img/Photos/Avatars/img%20(20).jpg" class="rounded-circle" alt="Sample avatar image."> </div> <!-- Content --> <div class="card-body"> <h4 class="font-weight-bold mb-3">Marie Johnson</h4> <p class="font-weight-bold blue-text">Web developer</p> <!-- Triggering button --> <a class="rotate-btn" data-card="card-1"><i class="fa fa-repeat"></i> Click here to rotate</a> </div> </div> <!-- Front Side --> <!-- Back Side --> <div class="face back"> <div class="card-body"> <!-- Content --> <h4 class="font-weight-bold">About me</h4> <hr> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Maxime quae, dolores dicta. Blanditiis rem amet repellat, dolores nihil quae in mollitia asperiores ut rerum repellendus, voluptatum eum, officia laudantium quaerat? </p> <hr> <!-- Social Icons --> <ul class="list-inline py-2"> <li class="list-inline-item"><a class="p-2 fa-lg fb-ic"><i class="fa fa-facebook"></i></a></li> <li class="list-inline-item"><a class="p-2 fa-lg tw-ic"><i class="fa fa-twitter"></i></a></li> <li class="list-inline-item"><a class="p-2 fa-lg gplus-ic"><i class="fa fa-google-plus"></i></a></li> <li class="list-inline-item"><a class="p-2 fa-lg li-ic"><i class="fa fa-linkedin"></i></a></li> </ul> <!-- Triggering button --> <a class="rotate-btn" data-card="card-1"><i class="fa fa-undo"></i> Click here to rotate back</a> </div> </div> <!-- Back Side --> </div> </div> <!-- Rotating card -->

Piotr Glejzer staff answered 2 years ago

Hi, are you using an Angular or jQuery version of MDB? Because that code what did you paste is working with jQuery package and I see that you picked topic 'MDB Angular Flipping Cards' so I'm little confused. That code what did you paste is working well with MDB Pro 4.5.11 - jQuery version, I checked that. So if you want use MDB Angular Flipping Cards you have to use our angular documentation about this.  If you have more question, let me know. I will try to help you. Here is a link to documentation : MDB Angular And here is a link to an example of Flipping cards with our snippets: Flipping cards - snippets Best, Piotr
Please insert min. 20 characters.
Status

Answered

Specification of the issue
  • User: Pro
  • Premium support: No
  • Technology: General Bootstrap questions
  • MDB Version: -
  • Device: Laptop , PC
  • Browser: opera , chrome
  • OS: windows
  • Provided sample code: No
  • Provided link: No