abhinayaa1787 / Giftastic

A page where user can see a list of animal buttons. When the user clicks the button, 10Gifs relevant to that animal will be displayes.If the user clicks another button again 10 Gifs will be prepended to the page. There is a button with heart icon, if this button is clicked, that Gif will be added to the user's favorite section.

Giftastic

This is a page where user can see a list of animal buttons. When the user clicks the button, 10Gifs relevant to that animal will be displayes.If the user clicks another button again 10 Gifs will be prepended to the page. There is a button with heart icon, if this button is clicked, that Gif will be added to the user's favorite section.

Technologies used to design this page used

• HTML
• CSS
• Javascript

HTML page

This has all the contents the users needs to see. This is the layout that appears on screen.

CSS

This has the styles that are applied to the page

Javascript behind the page explained:

• The page has a few animal buttons, if the user wish to add an animal, he/she can add an animal button
• Once the button is clicked there will be an Ajax request sent to Giphy API.
• The response(GIF) is listed on the page
• If anither button is clicked by the user, more Gifs will be loaded ontop of the older Gifs.
• There is a button with heart icon, this is generated dynamically when Gifs are loaded onto the page.
• If thus button is clicked, the Gif will be added to favories section.

Get the best Gifs!