We're almost ready to launch our very own Linkedin Profile!
Copy over the code you wrote in the index.html from the LinkedIn HTML challenge. Try not to make any changes to it!
Let's start by connecting our script.js and style.css files to our html document. Can you recall where in the document the link should be? Get some styling in your HTML file to make it look more like LinkedIn!
Next, let's make sure we can query the document by selectors. choose an element(or set of) and make four variables that hold the result of calling document.
Based on your above selectors, try to use a few JS methods to move along the DOM tree.
Using your above selectors:
- Manipulate the
innerHTML - Delete something
- Change CSS
- Add a CSS Property
Create a few Event Listeners for your profile to react to when a person clicks on an important button, or hovers over your image. Check out the JS features for dropdowns and tabs in bootstrap, and implement one.
You know the drill, take a selected element, and animate it!Perhaps you can connect your animation function with your previous EVENT LISTENERS??!