Need Help in Minor Problem with CSS
I have problem with accessing the following code while using animate.css
Code:
<head>
<style>
#rest {
-vendor-animation-duration: 3s;
-vendor-animation-delay: 2s;
-vendor-animation-iteration-count: infinite;
}
</style>
<script type="text/javascript">
$(document).ready(function(){
$('#rest').addClass('animated tada');
animationHover('#rest', 'tada');
animationClick('#rest', 'tada');
function animationHover(element, animation){
element = $(element);
element.hover(
function() {
element.addClass('animated ' + animation);
//wait for animation to finish before removing classes
window.setTimeout( function(){
element.removeClass('animated ' + animation);
}, 2000);
});
}
function animationClick(element, animation){
element = $(element);
element.click(
function() {
element.addClass('animated ' + animation);
//wait for animation to finish before removing classes
window.setTimeout( function(){
element.removeClass('animated ' + animation);
}, 2000);
});
}
});
</script>
</head>
<body>
<div id="check" class="animate tada">Hello! Its working1</div><br /><br />
<div id="rest">Hello! Its working2</div><br />
</body>
I am curious what I am doing wrong or missing something as I am new to jquery and javascript.
I will highly appreciate for an immediate reply along with solution.
Thanks in Advance
