JSFiddle - React, Tailwind, and code Playground
HTML
<head>
<style>
#s-m-t-tooltip{
/* basic */
max-width: 300px;
z-index: 10;
margin: 24px 14px 7px 12px;
/* style and design */
padding:8px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
border-radius:3px;
background: black;
color: white;
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script src="https://static.tumblr.com/lspzyz3/xloqk6cgp/jquery.style-my-tooltips.js"></script>
<script>
(function($){
$(document).ready(function(){
$("[title]").style_my_tooltips({
tip_follows_cursor: true,
tip_delay_time:100,
tip_fade_speed:300,
attribute:"title"
});
});
})(jQuery);
</script>
</head>
This is the image you hover over. All of this must be an embed. Remember to remove this text once you add it into your carrd.
<a href="#" data-toggle="tooltip" title="wow! a tooltip" class=""><img src="https://data.whicdn.com/images/335876159/original.jpg"></a>