Comments (1)
Using jQuery, add the following which will add the hover class of your choice to an element on document ready:
$(document).ready(function() {
$("#element").addClass("buzz");
});
If you want to use the buzz effect, which looks like this:
.buzz {
display: inline-block;
-webkit-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}
.buzz:hover, .buzz:focus, .buzz:active {
-webkit-animation-name: buzz;
animation-name: buzz;
-webkit-animation-duration: 0.15s;
animation-duration: 0.15s;
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
}
Change it to this:
.buzz {
display: inline-block;
-webkit-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0, 0, 0, 0);
-webkit-animation-name: buzz;
animation-name: buzz;
-webkit-animation-duration: 0.15s;
animation-duration: 0.15s;
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
}
That way, the effect starts as soon as the class is applied.
from hover.
Related Issues (20)
- Unable to pay for license HOT 2
- stay at the animated state HOT 1
- some transitions don't work (well) in IE and Edge HOT 2
- Please submit this to CDNjs HOT 1
- Split CSS files to make it possible to pick up individual effects [AMP Support] HOT 3
- Transform property giving me issues on Opera
- How to get background effects on rounded elements? HOT 1
- problem with addMediaConversion HOT 5
- Border Radius Issue HOT 2
- The license HOT 1
- Css3
- Why it's called Bob effect HOT 2
- [Documentation] More explanations for some of the effects?
- [Feature suggestion] Limit hover-effects after n seconds HOT 1
- Hover issue on "hvr-bounce-to-right" animation with border and border-radius properties HOT 1
- Trying to make sense of the commercial vs. MIT licensing
- How to change background color on hvr-bounce-to-left transitions HOT 2
- Add some pictures in the README file!
- can this library be customized? , for example, the underline color can be changed to redcan this library be customized? .for example the underline color can be changed to red . If so, please tell me how to use it
- dark mode / light mode can be implemented
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from hover.