css_magic_animations
34

Magic CSS3 animations by miniMAC

Come sapete, amo molto il linguaggio CSS ed in particolare mi piace sempre andare oltre, in questo caso ho voluto creare un pacchetto di animazioni in CSS3 che potrete usare liberamente per i vostri scopi e quindi nei vostri progetti web, si chiama Magic!

Il progetto è hostato anche su GitHub, questo per avere i migliori pareri dai migliori sviluppatori e quindi migliorare il codice, renderlo il più compatibile possibile con la maggior parte dei browser e per voi avere un codice sempre aggiornato e stabile.

Segnalatemi pure eventuali bugs nei vari browser, qui oppure su GitHub!

Changelog:

  • 28-09-2016 Refactoring del codice ed utilizzo di Gulp per la distro.

 

34

Wonderful work. Do you have a way to implement this into WordPress?

Rispondi

Hi!

is simple, you download the magic.css file from GitHub, and you put that in your actual theme folder on wordpress, then you put this code on your header.php file:
https://gist.github.com/miniMAC/3ab0e2d7699869b06b8b

After that you can use the instructions how to use from GitHub 🙂

I really like your work. It’s elegant and modern.
I wish you would publish your posts on English though, that more people would understand it. It doesn’t even matter if the English would not be all that great (mine is neither).

Please think about it.
But big thumbs-up for this blog! Keep up the good work.

Rispondi

Many thanks Mark! Really, i appreciate your comment and you gave me something to think about 🙂

WOW!
Effetti veramente fantastici!
Complimenti vivissimi.

WOW!
What Awesome effects!
Thumbs-UP!

Rispondi

Grazie Diego 🙂

Complimenti, hai realizzato un’ottima libreria e fa molto piacere che per una volta certe risorse si riescano a trovare anche in italiano.. ormai non ci speravo più. Anche a me piace molto smanettare con i css, però visto che con le funzioni in Javascript sono ancora un po’ indietro avrei una domanda da farti: è possibile ripetere l’effetto ad ogni passaggio del mouse sull’elemento? (dopo la prima volta devo sempre ricaricare la pagina) ..e come dovrei fare per ottenere i medesimi effetti al click del mouse invece che allo stato hover?
Intanto ti ringrazio per la libreria e se vorrai anche per l’eventuale chiarimento. Ciao!

Rispondi

Ciao Fabbryz, per fare quello che dici tu basterebbe per l’hover una semplice regola CSS con :hover e li metti il nome della magic animation. Invece per il click, li devi creare una funzione javascript, magari usando il .toggle

Really nice work but your demo page is all wrong. Your fixed positioning on the testbox and retrobox doesn’t work so when you scroll down to try out the bottom half of the effects you can’t see the effect. The video in the background gave me real problems! It keeps bugging out and it’s really annoying! I’d take it out if I were you. It doesn’t add to the demo. I’m trying to see the effects of the css not a massive video trying to load. It’s unfortunate because it is good work. I’m using Firefox by the way.

Rispondi

Thank You!

This works like a charm on Safari Mac / iPhone, but is stuttering a bit on Chrome…do you have an idea?

Rispondi

Great works!
Could you please set the position of diamond box in the demo to fixed?
When I try an animation at the end of the page I can’t see it in action.

Thanks

Rispondi

Hi there
You can please tell me where I can find the background video. I love this space Video. It’s beautiful.
Best Regards
Sabin

Rispondi

Hi, this video is from a paid channel called videohive

O.k., thanks

Hey, nice work! Really good…
Could you please help me? Some weeks before, the background of this page http://www.minimamente.com/example/magic_animations/ was stars in movement, but now it’s changed. Could please tell me how or where can I find the old background? I really need that, please 🙁
And congratulations again.

Rispondi

Hi, you can find this video on videohive

Ciao!
compliementi per l’articolo molto interessante.
Sto ancora applicandomi con jquery utilizzando WordPress quindi avrei una domanda: una volta inserito il il file magic.css nel mio template e richiamato nell’header del file con /css/magic.css”> non riesco a capire come proseguire. Dove inserire il jquery? e come utilizzare le animazioni? Grazie per il supporto

Rispondi

Ciao Grace, si devi usare jQuery come negli esempi che ho messo su GitHub 🙂

hi is this work on latest firefox browser

Rispondi

Ciao , complimenti , very good work.
Stavo cercando degli effetti così interessanti e vorrei chiederti ti occupi anche di creare dei mediaquery, poichè devo fare un restyling del mio sito e stavo cercando qualcuno che si occupasse di renderlo responsive.

Premetto che uso wordpress e ho un tema personalizzato, dal mio web master ed è ora di renderlo più efficace. Chiaramente non pretendo tu lo faccia gratuitamente , anzi , per questo ti chiedo come posso contattarti in privato
Grazie
Andrea

Rispondi

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *

Usando questo sito, accetti l’uso dei cookies.

Accetto