diff --git a/public_html/app.js b/public_html/app.js index b1e087b..d7ab596 100644 --- a/public_html/app.js +++ b/public_html/app.js @@ -1,12 +1,23 @@ //for debugging console.log('Im in your console. Inspect Element > Console.'); +$(document).ready(function () { + //for debugging + console.log('DOM loaded!. Inspect Element > Console.'); //wait for HTML to finish downloading document.addEventListener("DOMContentLoaded", function(){ + // 1) use an Effect + // https://learn.jquery.com/effects/intro-to-effects/ + // Hide or Show + // https://www.w3schools.com/jquery/jquery_hide_show.asp + // Grab the intro element and add some simple text dynamically // https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementById var introElem = document.getElementById('intro'); + // 2) Dynamically set CSS using JQuery + // https://learn.jquery.com/using-jquery-core/css-styling-dimensions/ + // Put some text in there introElem.textContent = "Hi. I'm in here. "; @@ -15,6 +26,8 @@ document.addEventListener("DOMContentLoaded", function(){ //debug out to the console console.log(introElem); +// Code Academy intro to JQuery + // https://www.codecademy.com/learn/learn-jquery // // Run the function below that will detect mousemovements in the Navigation area @@ -36,3 +49,4 @@ function logMouseOut() { var m = document.getElementById('mousy'); m.innerHTML = 'MOUSE OUT detected'; } +}); \ No newline at end of file diff --git a/public_html/features.js b/public_html/features.js index d62b2ef..0dac201 100644 --- a/public_html/features.js +++ b/public_html/features.js @@ -7,14 +7,14 @@ document.addEventListener("DOMContentLoaded", function(){ // Grab the UL element and count the number of LI nodes // https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementById var listElem = document.getElementById("navigation").getElementsByTagName("li"); - listElem[0].textContent="My name is puja"; + listElem[0].textContent="Best Time to Visit"; //debug out to the console console.log(listElem.length); // Put some text in there var statsElem = document.getElementById("stats"); - statsElem.textContent = "There are " + listElem.length + " Places to explore."; + //statsElem.textContent = "There are " + listElem.length + " Places to explore."; // // Run the function below that will multiple this the LI of places by 10 and display it at the H1 element @@ -25,7 +25,7 @@ document.addEventListener("DOMContentLoaded", function(){ // https://developer.mozilla.org/en-US/docs/Web/API/Element/getElementsByTagName var h1Element = document.getElementsByTagName("h1"); // Display the new headline - h1Element[0].textContent=increaseNumber(listElem.length); + //h1Element[0].textContent=increaseNumber(listElem.length); }); diff --git a/public_html/index.html b/public_html/index.html index 6caa1d7..86e3102 100644 --- a/public_html/index.html +++ b/public_html/index.html @@ -1,33 +1,97 @@ + + San Francisco + - - - + - + + +
+
+
+ One of three columns +
+
+ One of three columns +
+
+ One of three columns +
+
+
+ +

A Guide to Exploring San Francisco

-

- - -
+ +
+ SF photo
+
+ SF photo
+

Best Time to Visit

San Francisco has a mediterranean climate. Being a peninsula, it remains pretty cool throughout the year, with most of the rainfall occurring during the winter and spring seasons. You should visit the city during the summer and fall seasons, but keep in mind that this is also peak tourist season.

-

Places to See

+

SF photo

+

SF photo

+ +

Places to See

San Francisco is great for sight-seeing, and there are many not as known lookout points that provide you with fantastic views of the city's skyline.

+ + +

SF photo

+

SF photo

+ +
+

Things to Do

-

There is always an activity or event happening every day in the city.

-

Food and Drinks

+

There is always an activity or event happening every day in the city. Go for a cable car ride downtown. Take a stroll at Chinatown + and enjoy the delicious freshly baked bakery items. Seal watch at the pier or enjoy the beautiful view from the Coit tower. Visit the beautiful + natural beauty of Marine Headlands and enjoy the scenic route on the way

+

SF photo

+

SF photo

+ +

Food and Drinks

The city is full of foods from across the entire universe. You can find almost any type of cuisine with ease.

+ + + + + \ No newline at end of file diff --git a/public_html/style.css b/public_html/style.css index 4e10d09..01f786c 100644 --- a/public_html/style.css +++ b/public_html/style.css @@ -1,20 +1,30 @@ body { box-sizing: border-box; - height: 300px; - width: 800px; margin: auto; padding: 50px; /*Remove this background-color! It is here to make sure that the css and html are linked.*/ - background-color: cornflowerblue; - border: 5px dotted gainsboro; + background-color: pink; + border: 5px black; + background-image: url("); + background-repeat: no-repeat; + background-position: right top; + background-attachment: fixed; + } + + } } .header { - background-color: gray; - background-image: url(http://getdrawings.com/san-francisco-bridge-vector#san-francisco-bridge-vector-25.png) text-align: center; - font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif; + font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif; + color: yellow; +}; +h1 { + font-family: Verdana, Geneva, Tahoma, sans-serif; + font-style: oblique; } -h1 { - color: lightblue; +h2 { + font-family: 'Courier New', Courier, monospace; + font-style: inherit; + }