Skip to content

Use Javascript and CSS effects to make a banner with an animated random starfield in the background.

Notifications You must be signed in to change notification settings

ltw-webdev-javascript/randomized-starfield-banner

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

6 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

summary time deliverables
Use Javascript and CSS effects to make a banner with an animated random starfield in the background.
1 hour
1 HTML file, 1 CSS file, 1 JS file

Randomized starfield banner

Overview

  • Fork this repository.
  • Write Javascript that will generate 75 stars into the banner with random locations, opacities, rotations, and scales.
  • Animate the width and height of the stars so they pulse.
  • Much of the CSS is written for you: concentrate on the animation
  • DO NOT change the HTML.
  • Run it through Markbot and make sure it passes all the checks.

Details

  • Number of stars: 75
  • Randomized: top, left, opacity, transform: rotate() scale()
  • Getting the width/height of elements: outerWidth(), outerHeight()

Goal

Create the interaction shown in the linked video.


Hand in

Drop this folder into your Markbot application. Make sure to fix all the errors. And submit online.

About

Use Javascript and CSS effects to make a banner with an animated random starfield in the background.

Resources

Stars

Watchers

Forks

Releases

No releases published

Sponsor this project

 

Packages

No packages published