Aim – Create a page all about the brain... only requirement, because the brain is awesome.
Now it's time to take it to the text editor and starting writing some stuff...
Let's bring it to life with SVG line animation for starters...
I have converted everything to SVG and added hover classes and a bit of fancy animation for some interactivity (somewhat), here is the result so far!
So after this we're gonna have to attach the hover events to some useful information, a simple example is shown below:
I have since bettered the layout and added each brain parts' functions. They highlight when the corresponding brain part is hovered. It is much slower than I'd like it to be, but we'll get to that soon:
This is definitely only the first version, as I've wanted to build something like this for a long time, so I'll be damned if I don't make it even cooler ;)
You can check out the full demo here, it's a Codepen so you'll be able to see how terrible my code is, don't have time to refactor as it is now 2:58am on a Sunday morning...
Hope you all enjoyed!
Who doesn't love prime numbers?
AIM – Create a grid system that allows the generation and cancellation of primes and non-primes respectively. I just really want to create something that has Math in it because it's been a while, so here we go...
Step 1: Create function returning non-primes
Ok so I have done this, but I like looking at primes, so I made it return primes instead... but it's easy to switch what I want to see. Anyway, here it is:
Step 2: Create a grid system in which we will simulate the visualisation
The above function is pretty straight forward... just adds an extra grid item to the grid. Just think boxes next to each other, not pretty yet. I added an extra class of the actual number so it's easier to target the specific grid item with jQuery.
Step 3: Create a function to add an "active" class to all the prime numbers in the grid
This is pretty easy to do because we gave each item a classname with the actual number, so no dramas!
Now set the limit you want and call all the methods in the following order and voila!
Here is my Codepen so you can play around with my mediocre code. If I did anything wrong or you'd like to suggest something better, please do.
This was fun, enjoy!