Hi! I have just finished my Random Quote Machine, I appreciate some feedback. Also if someone could give me some tips about transitions it would be great, as I would like to make transitions smoothly.
I am trying to get the first quote without any jumps and then trying to do like a fade in/fade out transition, but everything I get is bumpy.
You can write your own transitions either using javaScript or CSS; When using css you will hide/show element using JS and css transitions will do its work. I would always recommend CSS way, because its fast and much smooth and less hassle.
Main idea:
Remove active (could be anything) class from quote container element (quote-container) when ajax starts
Show some progress during ajax call
Add active class to container again using JS when ajax finished
I hope you get the idea. For complex transitions or animations there are third-party libs available but i would not recommend using these until you get idea of transitions/animations yourself.