Music: Animation for Song List

[CharityBunyon]

Story

As a user, when I expand or minimize the track list, I want to see the smoothly slide left or right, instead of just appearing

Acceptance Criteria

WHEN The user clicks the expand arrow THEN the album image should slide left and reveal the track list AND WHEN The user clicks the minimize arrow THEN the album image should slide right and hide the track list

Development Notes

• Add classes albumImage to the image/title/year div & trackList to the track list div
• remove bootstrap column classes, widths will need to be set in CSS for the animation
• Write function to toggle CSS class in JS
• Add click event listeners to minimizeTracks[i] and expandTracks[i]to trigger toggle function
• set duration to 2 seconds

[aclai4067]

resources: https://www.w3schools.com/css/css3_animations.asp https://css-tricks.com/controlling-css-animations-transitions-javascript/

[djunaim]

👍