From ffd2e8ef01d6d31959973c48f45609b2113b629b Mon Sep 17 00:00:00 2001 From: Dashon-Hawkins Date: Tue, 28 Feb 2017 17:23:53 -0700 Subject: [PATCH] Dashon Hawkins commit --- README.md | 4 ++-- boxes.js | 15 ++++++++++++++- 2 files changed, 16 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index 002b475..990e7b7 100644 --- a/README.md +++ b/README.md @@ -4,7 +4,7 @@ A grid of colorful boxes that can be used as a jQuery playground for learning se ### Exercise 1 - DOM Ready -Reference [this page](https://learn.jquery.com/using-jquery-core/document-ready/). Add a callback function to ready that alerts a message saying, ready for DOM manipulation. Try using both styles of callbacks. +Reference [this page](https://learn.jquery.com/using-jquery-core/document-ready/). Add a callback function to ready that alerts a message saying, ready for DOM manipulation. Try using both styles of callbacks. ### Exercise 2 - Selectors, CSS, Attributes @@ -12,7 +12,7 @@ Go to the [MDN docs for selectors](https://developer.mozilla.org/en-US/docs/Web/ 1. Find the secretBox on the page. Set the background color to white. Add an h1 tag that says, "secret box!" 2. Find all child divs of the first row. Set the class for each div to boxType3. -3. Make the last box in the last row disappear. (Hint, look into the dispaly style. Also, you should only get back one element from your selector.). +3. Make the last box in the last row disappear. (Hint, look into the display style. Also, you should only get back one element from your selector.). 4. Change all red boxes to white. 5. Get the first two divs in the second row. Take away all styling from the divs. 6. Get all divs inside the container that are not row divs and are not the secret box div. Set the width of the divs to 2 pixels. diff --git a/boxes.js b/boxes.js index 6b2b3db..6ebaf47 100644 --- a/boxes.js +++ b/boxes.js @@ -1 +1,14 @@ -console.log("hello world"); + +$(document).ready(function() { + console.log("hello ready"); + + $('#secretBox').css("background-color", "white"); + $('#secretBox').html("

secrect box

"); + $('#row1').children().addClass("boxType3"); + $('#row4 div:last-child').css("display", "none"); + $('.boxType1').css("background", "white"); + $('#row2').children().slice(0, 2).remove(); + //$('#row2').eq().removeClass(); + //$("div").not(".row #secretBox").css("width", "2px"); + +})