javascript - How to create an interactive (clickable) animation for responsive website? -
anyone have suggestions object animations can show text on hover or click? looking on:
trying make these crystals objects interactive. sample mockup website here.
surround animations div, bind jquery mouseover , mouseout events add , remove css class contains desired text. this:
html:
<div class="crystaldiv"> <!-- contains image of crystal. can have many want --> </div>
css:
.crystalhover:after{ content:"whatever text"; position: absolute; /* use top, bottom, left, right position - relative crystal div*/ }
javascript:
$('.crystaldiv').on('mouseover',function(e) { $(this).addclass('crystalhover'); }); $('.crystaldiv').on('mouseout',function(e) { $(this).removeclass('crystalhover'); }); // can same thing click event if want
Comments
Post a Comment