Front-End Programming Project on Free Code Camp

1 min read

\"front-end_programming\"

So I am working on the front-end programming projects for Free Code Camp. The first one is a tribute page to anyone you want. I chose Carl Sagan as he is my skeptical hero and scientist “for the people”. I’ve read one of his books and plenty of his essays and I just think the guy was amazing, smart, and could relay complicated scientific concepts to lay people.

So I spent an hour working on the HTML and CSS. What I want to do is use jQuery to fade the quotes in and out when someone clicks on the page. So, essentially I need to have an even listener for mouse clicks, something like:

$( “#quote_1” ).click(function() {
$( “p” ).fadeIn( “slow”, function() {
// Animation complete
});
});
$( “#quote_1” ).click(function() {
$( “p” ).fadeOut( “slow”, function() {
// Animation complete.
});
});

I also want to make the quotes float left and be in a block. Not sure how I am going to get it done but I will. I had it in blockquotes and I may change it back.

It’s crude but I am working on it. You can find the pen here:

http://codepen.io/twhite96/pen/dMbwyM

CC BY-SA 4.0 Front-End Programming Project on Free Code Camp by Tiffany White is licensed under a Creative Commons Attribution-ShareAlike 4.0 International License.