frontend-101

Department of Visual Media Winter Assignment

1. A

   • A1 : Responsive Grid
     • Responsive grid made with felxbox
   • A2 : Incomplete Responsive Grid
     • Incomplete responsive grid made with flexbox
   • A3 : Responsive Trippy Grid
     • Responsive trippy grid made with flexbox and css animation
   • A4 : Responsive Navigation Bar
     • A responsive navigation bar made using CSS flexboxes, media queries and viewport
   • A5 : 3D Buttons
     • Two 3D Buttons made with css 3D transformations
   • A7 : The X Factor
     • A replica of the iPhone X using HTML and CSS.

2. B

   • B1 : Drums
     • Keydown event used to make a basic LaunchPad
   • B2 - Clock
     • Clock made using JavaScript
   • B3 - Multiple Select
     • Making multiple selection possible using Shift key for checkboxes
   • B4 - Sequence Detector
     • Detecting a particular sequence as entered by the user(in this case it is “DVM” - all caps)
   • B5 - Image Slide In
     • Triggering animations when user reaches a particular part of the page by scrolling
   • B6 - FrontEnd Tech
     • Storing data locally on user’s browser (using JavaScript Cookies or the the LocalStorage API)
   • B7 - Around The World
     • Making a responsive map with the features of panning and zooming (functional both on Desktop and on handhelds)