Skip to content
/ draw Public

A site exploring JS canvas, draw functions with interactivity & other JS programs!

Notifications You must be signed in to change notification settings

Fishbite/draw

Repository files navigation

draw

A site exploring JS canvas and draw functions with interactivity!

Added a JavaScript program to convert English numbers into Roman Numerals during the COVID19 lockdown.

OK! We only have the first page doing user interaction at the moment, but I hope you get the drift. I'm thinking of doing a similar kind of thing with the other pages - perhaps giving user feedback of the areas of the shapes produced and perhaps an option to view the underlying code without leaving the page. Could be cool, but personally I don't like reading stuff like that on a small screen, some folks do, I know, so it's a maybe.

In the first instance I was just researching into drawing using JavaScript (as a break!). I'd been following a well known course on JS and just thought, well, this is really DIFFICULT! but I was slogging my way through it regardless. Then I thought LETS FIND SOMETHING TO DO WITH THIS before I went insane! So this is my first pitch at putting together a website using JS on top of html & css. Man! I've had to jump through hoops to get here, but this is where it's at, at the moment.

I was thinking of drawing a house or two with a story- you know, simple ones like parents and children put together on paper :)

One thing I wanted to use this excercise for was to experiment with slide in menus. Things I've seen around just don't cut it for me. I really hate the floating hamburger menu that just sits there in the corner of your screen - a little tick of an eyesore :(

So this is what I have come up with. Virtually transparent, except it looks like it made of glass with a tinge of blue. Looks great but, to increase the contrast (minimise background interference) of the menu button text I've decreased the transparency when the user hovers over it or presses it with finger or something.

In order to minimise the collateral of pixel usage and space on screen when the menu is closed, I've created a virtually invisible tab that extends out quite a way beyond that of the visible part of the hidden menu. That really works for me, possibly needs sticking out a bit more!

Let me know what you think.

Fishbite AKA LoonyToon

or just plain Stu

About

A site exploring JS canvas, draw functions with interactivity & other JS programs!

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published