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/index.html b/public_html/index.html index 0ffdce0..86e3102 100644 --- a/public_html/index.html +++ b/public_html/index.html @@ -1,93 +1,97 @@ - - - + + San Francisco - - - - - - -

A Guide to Exploring San Francisco

-

- - - - -

Smiley face

-

Smiley face

-

Smiley face

+ +
+

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.

-

Smiley face

-

Smiley face

-

Smiley face

- - -

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. - *Pier 39 - *Coit tower - *Chinatown - *Downtown - *Alcatraz Island - *Lombard Street - *Golden Gate Bridge - *Marine Headlands - *Baker Beach, Ocean Beach - -

- -

Smiley face

-

Smiley face

-

Smiley face

- - +

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. 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

- -

Smiley face

-

Smiley face

-

Smiley face

- - -

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 5a4e6a1..01f786c 100644 --- a/public_html/style.css +++ b/public_html/style.css @@ -1,13 +1,11 @@ body { box-sizing: border-box; - height: 1500px; - width: 1000px; margin: auto; padding: 50px; /*Remove this background-color! It is here to make sure that the css and html are linked.*/ - background-color: gray; + background-color: pink; border: 5px black; - background-image: url("https://images.unsplash.com/photo-1471229058801-75ee9a43ef35?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1532&q=80"); + background-image: url("); background-repeat: no-repeat; background-position: right top; background-attachment: fixed; @@ -16,13 +14,10 @@ body { } } .header { - background-color:; text-align: center; font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif; - color: orangered - + color: yellow; }; - h1 { font-family: Verdana, Geneva, Tahoma, sans-serif; font-style: oblique;