projectinclude-dexterrivera / HTMLBootcamp2017

Here you will find all of the resources and code you need to complete our HTML Bootcamp!
0 stars 2 forks source link

Map not working #5

Open Smith1337 opened 7 years ago

Smith1337 commented 7 years ago
<head>
  <link rel="stylesheet"  href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css"> 
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/semantic-ui/2.2.10/semantic.min.css">
  <script src="https://cdn.jsdelivr.net/semantic-ui/2.2.10/semantic.min.js"></script>
  <link href="style.css" rel="stylesheet">
  <script src="script.js"></script>
  <script async defer
          src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDwhwzuYqcXRjqamI5AdLCsl9x77TkLVpE&callback=initMap"></script>
</head>
  <div class="ui top inverted purple fixed menu">
    <a class="item" href="#intro">Introduction</a>
    <a class="item" href="#bio">Biography</a>
    <a class="item" href="#sports">Favorite Sports</a>  
    <a class="item" href="#games"> Favorite Games</a>
  </div>
<body>
  <div id="fb-root"></div>
  <script>(function(d, s, id) {
      var js, fjs = d.getElementsByTagName(s)[0];
      if (d.getElementById(id)) return;
      js = d.createElement(s); js.id = id;
      js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.10";
      fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));</script>
  <div class="banner"> 
    <h1 class="down white"> Welcome to my <strong>amazing</strong> Website!</h1> 
    <p class= " side white"> Hi user, thank you for clicking on my website.</p>
  </div>

<div class="website">

   <div class="ui grid">
     <div class="four wide column ">
       <div class="ui card">
         <div class="image">
           <img src="https://heatherchristenaschmidt.files.wordpress.com/2011/09/facebook_no_profile_pic2-jpg.gif">
         </div>
         <div class="description">
           <div class="ui list">
             <div class="item"><i class="Canada flag"></i> Born in Canada</div>
             <div class="item"><i class="Birthday icon"></i> Birthday on June 26, 2005</div>
             <div class="item"><i class="Home icon"></i> Lives in Toronto, Ontario</div>
             <div class="item"><i class="Calendar icon"></i> 12 years old</div>
             <div class="item"><i class="Graduation icon"></i> Attends Amesbury Middle School</div>
           </div>
         </div>
         <div class="extra content">
           <a>
             <i class="user icon"></i>
             1.4m Friends 
           </a>
           <div class="item"><i class="Blue Thumbs Up icon"></i> 1.2m Likes</div>
           <div class="item"><i class=" red Like icon"></i> 1.5m Loves </div>
         </div>
         <button class="ui primary button">Like</button>
         <button class="ui red button">Love</button>
       </div>
       <div class="ui raised segments">
         <div class="ui purple inverted segment">
           <h2 id='photos'><i class="photo icon"></i>Photos</h2>
         </div>

         <div class="ui segment"> 
           <div class="ui small images">
             <img class="ui image" src="https://www.famousbirthdays.com/headshots/jesserthelazer-6.jpg">
             <img class="ui image" src="https://i.ytimg.com/vi/s5y-4EpmfRQ/maxresdefault.jpg">
             <img class="ui image" src="https://shop.metowe.com/skin/frontend/m2w_redesign/default/redesign/img/m2w.png">
             <img class="ui image" src="http://2.bp.blogspot.com/-FVtExxT-3W4/USB5kz5loNI/AAAAAAAAQTg/r2kxdCmSYy0/s1600/terrence-ross-and-vince-carter-jersey-win-the-sprite-slamdunk-contest-2013-funny-meme-photos-nba.jpg">
           </div>
         </div>  
       </div>
     </div>

     <div class="nine wide column">
    <div class=" ui raised segments">
         <div class= "box3 animated bounceInRight ui purple inverted segment"> <h1 class= "white"><i class="male icon"></i>  Biography </h1>
       </div>
      <p class= "popup1 ui segment"> Hi my name is Smeet Shah, I am 12 years old. My birthday is <strong>June 26, 2005.</strong> I was born in <strong>Toronto, Ontario.</strong> I live in Toronto, Ontario and I go to <strong>Amesbuy Middle School.</strong> Im in the seventh grade. </p> </div>

        <div class= "ui raised segments"> <div class="box4 animated bounceInLeft ui purple inverted segment" ><h1><p class= "white"><i class="soccer icon"></i> Some of my favorite sports are</p></h1>
          <body/></div>
          <ol class= "ui segment"> <li>Basketball</li>
          <li> Soccer (goal keeper)</li>
          <li> Baseball (short stop)</li>
          </ol></div>

        <div class="ui raised segments">
          <div class="box 5 animated bounceInRight ui purple inverted segment"> <h1 class= "white"> <i class="game icon"></i> Some of my favorite video games </h1>
         </div>
          <ol class= "ui segment"> <li> 2k17 and all the other 2k's (Im a very big fan of basketball video games and in genral</li>
            <li> MLB the Show 16/17</li>
            <li> All the Pokemon games except Pokemon Ranger that game was trash</li></ol>
     </div>

         <div class="ui raised segments">
           <div class="ui purple inverted segment">
             <h2 id='movies'><i class="film icon"></i>Movie Reviews</h2>
           </div>

           <div class="ui segment"> 
             <div class="ui items">
               <div class="item">
                 <div class="image">
                   <img src="https://images-na.ssl-images-amazon.com/images/I/91Ui-tX4RRL._SY445_.jpg">
                 </div>
                 <div class="content">
                   <a class="header">Dumb & Dumber To</a>
                   <div class="meta">
                     <i class=" yellow Star icon"></i>
                     <i class=" yellow Star icon"></i>
                     <i class=" yellow Star icon"></i>
                     <i class=" yellow Star icon"></i>
                   </div>
                   <div class="description">
                     <p></p>
                   </div>
                   <div class="extra">
                     "This was an amazing movie! This movie is similar to my life and thats why i liked it the most. The 2 main characters, Harry & Lloyd were really like me and my friend stupid and funny!"
                   </div>
                 </div>
               </div>

               <div class="item">
                 <div class="image">
                   <img src="https://upload.wikimedia.org/wikipedia/en/3/37/Logan_2017_poster.jpg">
                 </div>
                 <div class="content">
                   <a class="header">Logan</a>
                   <div class="meta">
                     <i class=" yellow Star icon"></i>
                     <i class=" yellow Star icon"></i>
                     <i class=" yellow Star icon"></i>
                     <i class=" yellow Star icon"></i>
                   </div>
                   <div class="description">
                     <p></p>
                   </div>
                   <div class="extra">
                     "This was a great movie! Very action packed! The main characters were Logan and X-23!
                   </div>
                 </div>
               </div>

               <div class="item">
                 <div class="image">
                   <img src="https://upload.wikimedia.org/wikipedia/en/8/8b/Kingsman_The_Secret_Service_poster.jpg">
                 </div>
                 <div class="content">
                   <a class="header">Kingsman the Secret Service</a>
                   <div class="meta">
                     <i class=" yellow Star icon"></i>
                     <i class=" yellow Star icon"></i>
                     <i class=" yellow Star icon"></i>
                     <i class=" yellow Star icon"></i>
                   </div>
                   <div class="description">
                     <p></p>
                   </div>
                   <div class="extra">
                     "This was a great movie! The main charaters were Eggsy, Harry and the villian Valentine. This movie somewhat scared the living soul out of me. I liked this movie a lot because of the action packed content."
                   </div>        
                 </div>
               </div>
             </div>
           </div>  
         </div>

       <div class="ui raised segments">
         <div class="ui purple inverted segment">
           <h1 class="white"> <i class="map pin icon"></i> Check-In </h1>
           <div class="item">
           <div class="image">
           </div>
         </div>
       </div>
        <div class= "ui segment">
         <div class="ui items">
           <div class="item">
             <div class="image">
               <img src="https://scontent.cdninstagram.com/t51.2885-15/s640x640/sh0.08/e35/14719837_209523122819333_3953303897438683136_n.jpg">
             </div>
             <div class="content">
               <a class="header">Air Canada Center</a>
               <div class="meta">
                 <span></span>
               </div>
               <div class="description">
                 <p>Air Canada Centre, Toronto, ON M5E 1Z8</p>
               </div>
               <div class="extra">
                 "The Me to We concert that took place at the Air Canada Center was really fun! Special preformences from Zendaya, Macklemore and Lily Singh"
               </div>
               <div id='map'></div>
             </div>
           </div>
        </div> 
       </div>
         <div class="ui raised segments"> 
           <div class="ui purple inverted segment">
             <h1 class="white"> Comments </h1>
           </div>
           <div class="ui segment">
             <div class="fb-comments down4" data-href="https://smith1337.github.io/MyWebsite/" data-width="100%"  data-numposts="5"></div></div>
         </div>
       </div>
       </div>

     <div class="three wide column">
       <div class="ui raised segments">
         <div class="ui purple inverted segment">
           <h2><i class="user icon"></i>Friends</h2>
         </div>
         <div class="ui segment">
           <div class="ui fluid card">
             <div class="image">
               <img src="https://semantic-ui.com/images/avatar/large/daniel.jpg">
             </div>
             <div class="content">
               <a class="header">Daniel Louise</a>
             </div>
           </div>
           <div class="ui fluid card">
             <div class="image">
               <img src="https://semantic-ui.com/images/avatar/large/helen.jpg">
             </div>
             <div class="content">
               <a class="header">Helen Troy</a>
             </div>
           </div>
           <div class="ui fluid card">
             <div class="image">
               <img src="https://heatherchristenaschmidt.files.wordpress.com/2011/09/facebook_no_profile_pic2-jpg.gif">
             </div>
             <div class="content">
               <a class="header">John Bautista</a>
             </div>
           </div>
         </div>
       </div>
     </div>
  </div>
  </div>
  <div class="footer">
    Thank you for visiting my website! You can also find at these places: 
    <button class="ui facebook circular icon button">
      <i class="facebook icon"></i>
    </button>
    <button class="ui twitter circular icon button">
      <i class="twitter icon"></i>
    </button>
    <button class="ui linkedin circular icon button">
      <i class="linkedin icon"></i>
    </button>
    <button class="ui youtube circular icon button">
      <i class="youtube icon"></i>
    </button>

</div>
</body>