Skip to content

HTML and CSS only website with scroll-timeline, parallax, modified scroll bar, and smooth scrolling. Done as a final project for CS 260.

License

Notifications You must be signed in to change notification settings

jonahksimmons/cs_260_final

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

10 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Cs 260 Final project

title screenshot Test of what could be done with just html and css. Note that this only works on full screen desktop as of now. I learned a lot about design, writing, and web development through this and hope you find it educational or interesting.

Inspiration

From our lesson in CSS, we were shown CSS Zen Garden and I was so intrigued. It was incredible to see what they could do with such simple technologies. I find working with restrictions very interesting and fun and typically am drawn to minimalism. I decided to see what I could do with just one HTML and CSS file (excluding pictures).

Compatibility

body screenshot The layout only works on full screen desktop browsers (1920x1080) as of now.

Experimental/Newer Features

There is a modified scroll bar that requires either Firefox version 64+ or is a non-standard feature in Chrome 2+, Edge 79+, Opera 15+, or Safari 4+.

It also uses scroll-timeline feature which would need to be explicitly enabled by setting "layout.css.scroll-linked-animations.enabled" to true if you are using Firefox, or by enabling the Experimental Features if you are using Chrome.

Credits

All pictures are modified from the public domain and all code is my own work

About

HTML and CSS only website with scroll-timeline, parallax, modified scroll bar, and smooth scrolling. Done as a final project for CS 260.

Topics

Resources

License

Stars

Watchers

Forks