Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript Using jQuery Plugins Add a Sticky Navigation Bar Adding Sticky Navigation

Why are script tags inside the body tags of the index and team files but outside of the body tags in work file?

Team

<!DOCTYPE html>
<html class="no-js">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <title>Agency - A Treehouse template</title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <!--CSS-->
        <link href='http://fonts.googleapis.com/css?family=Roboto:400,100,300,500,700,900' rel='stylesheet' type='text/css'>
        <link rel="stylesheet" href="css/normalize.min.css">
        <link rel="stylesheet" href="js/animsition/animsition.min.css">
        <link rel="stylesheet" href="css/main.css">
    </head>
    <body>
      <div class="row container animsition">
        <header class="row header">
          <div class="grid-third">
            <a href="index.html" class="logo animsition-link"></a>
          </div>
          <div class="grid-third">
            <h1 class="description">We build apps</h1>
          </div>
          <div class="grid-third">
            <nav>
              <a href="index.html" class="animsition-link">Home</a>
              <a href="work.html" class="animsition-link">Work</a>
              <a href="#" class="active animsition-link">Team</a>
            </nav>
          </div>
      </header><!--/header-->
        <div class="main row">
        <div class="grid-full">
          <div class="team">
            <h2>Meet the team</h2>
            <h4>United we stand divided we fail</h4>
          </div>
          <div class="grid-fifth">
            <img src="img/team-members/team--01.png" alt="" class="avatar" />
            <h3>Bill Bigsby IV</h3>
            <p>CEO</p>
          </div><!--/1-->
          <div class="grid-fifth">
            <img src="img/team-members/team--02.png" alt="" class="avatar"  />
            <h3>Jane Jewels</h3>
            <p>CFO</p>
          </div><!--/2-->
          <div class="grid-fifth">
            <img src="img/team-members/team--03.png" alt="" class="avatar"  />
            <h3>Doughy Digital</h3>
            <p>Lead Developer</p>
          </div><!--/3-->
          <div class="grid-fifth">
            <img src="img/team-members/team--04.png" alt="" class="avatar"  />
            <h3>Ralph Raider</h3>
            <p>Lead Designer</p>
          </div><!--/4-->
          <div class="grid-fifth">
            <img src="img/team-members/team--05.png" alt="" class="avatar"  />
            <h3>Nolan Nitro</h3>
            <p>Senior Developer</p>
          </div><!--/5-->
          <div class="grid-fifth">
            <img src="img/team-members/team--06.png" alt="" class="avatar"  />
            <h3>Donna Danger</h3>
            <p>Senior Developer</p>
          </div><!--/6-->
          <div class="grid-fifth">
            <img src="img/team-members/team--07.png" alt="" class="avatar"  />
            <h3>Rebecca Roo</h3>
            <p>Senior Designer</p>
          </div><!--/7-->
          <div class="grid-fifth">
            <img src="img/team-members/team--08.png" alt="" class="avatar"  />
            <h3>Lenny Lowes</h3>
            <p>Senior Designer</p>
          </div><!--/8-->
          <div class="grid-fifth">
            <img src="img/team-members/team--09.png" alt="" class="avatar"  />
            <h3>Eli Elfs</h3>
            <p>Designer</p>
          </div><!--/9-->
          <div class="grid-fifth">
            <img src="img/team-members/team--10.png" alt="" class="avatar"  />
            <h3>Trevor Tuesday</h3>
            <p>Junior Developer</p>
          </div><!--/10-->
          <div class="grid-fifth">
            <img src="img/team-members/team--11.png" alt="" class="avatar"  />
            <h3>Tori Traffic</h3>
            <p>Project Mangagement</p>
          </div><!--/11-->
          <div class="grid-fifth">
            <img src="img/team-members/team--12.png" alt="" class="avatar"  />
            <h3>Fido Fur</h3>
            <p>Office Manager</p>
          </div><!--/12-->
        </div>
        </div><!--/main-->
        <footer>
          <div class="row">
            <div class="grid-full">
              <p>Connect with us</p>
              <ul class="social">
                <li>
                  <a href="#" class="pink"></a>
                  <a href="#" class="light-blue"></a>
                  <a href="#" class="dark-blue"></a>
                </li>
              </ul>
            </div>
          </div>
        </footer><!--/footer-->
        </div>
        <script src="js/jquery-1.11.2.min.js"></script>
        <script src="js/animsition/jquery.animsition.min.js"></script>
        <script src="js/sticky/jquery.sticky.js"></script>
        <script src="js/main.js"></script>
    </body>
</html>

Index

<!DOCTYPE html>
<html class="no-js">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <title>Agency - A Treehouse template</title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <!--CSS-->
        <link href='http://fonts.googleapis.com/css?family=Roboto:400,100,300,500,700,900' rel='stylesheet' type='text/css'>
        <link rel="stylesheet" href="css/normalize.min.css">
        <link rel="stylesheet" href="js/animsition/animsition.min.css">
        <link rel="stylesheet" href="css/main.css">
    </head>
    <body>
      <div class="row container animsition">
        <header class="row header">
          <div class="grid-third">
            <a href="index.html" class="logo"></a>
          </div>
          <div class="grid-third">
            <h1 class="description">We build apps</h1>
          </div>
          <div class="grid-third">
            <nav>
              <a href="#" class="active">Home</a>
              <a href="work.html" >Work</a>
              <a href="team.html" >Team</a>
            </nav>
          </div>
      </header><!--/header-->
        <div class="row">
          <div class="grid-full">

          </div>
          <div class="main row">
            <div class="grid-third">
              <img src="img/sticker-team.png" alt="" />
              <p>United we stand divided we fail.  Meet the all star team behind the agency.</p>
              <a href="team.html" class="button">Meet the Team</a>
            </div><!--/team-->
            <div class="grid-third">
              <img src="img/sticker-work.png" alt="" />
              <p>Check our latest app builds or download them in the App Store.</p>
              <a href="work.html" class="button">Latest Projects</a>
            </div><!--/work-->
            <div class="grid-third">
              <img src="img/sticker-contact.png" alt="" />
              <p>Have questions or requests?  Feel free to contact us, we’d love hear from you.</p>
              <a href="#" class="button">Contact Us</a>
            </div><!--/contact-->
          </div>
        </div><!--/main-->
        <footer>
          <div class="row">
            <div class="grid-full">
              <p>Connect with us</p>
              <ul class="social">
                <li>
                  <a href="#" class="pink"></a>
                  <a href="#" class="light-blue"></a>
                  <a href="#" class="dark-blue"></a>
                </li>
              </ul>
            </div>
          </div>
        </footer><!--/footer-->
        </div>
        <script src="js/jquery-1.11.2.min.js"></script>
      <script src="js/animsition/jquery.animsition.min.js"></script>
      <script src="js/sticky/jquery.sticky.js"></script>
      <script src="js/main.js"></script>
    </body>
</html>

Work

<!DOCTYPE html>
<html class="no-js">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <title>Agency - A Treehouse template</title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <!--CSS-->
        <link href='http://fonts.googleapis.com/css?family=Roboto:400,100,300,500,700,900' rel='stylesheet' type='text/css'>
        <link rel="stylesheet" href="css/normalize.min.css">
        <link rel="stylesheet" href="js/animsition/animsition.min.css">
        <link rel="stylesheet" href="css/main.css">
    </head>
    <body>
      <div class="row container animsition">
        <header class="row header">
          <div class="grid-third">
            <a href="index.html" class="logo animsition-link"></a>
          </div>
          <div class="grid-third">
            <h1 class="description">We build apps</h1>
          </div>
          <div class="grid-third">
            <nav>
              <a href="index.html" class="animsition-link">Home</a>
              <a href="#" class="active animsition-link">Work</a>
              <a href="team.html" class="animsition-link">Team</a>
            </nav>
          </div>
      </header><!--/header-->
        <div class="row">
          <div class="grid-full">
            <h2>Our Work</h2>
            <h4>Here’s a collection of our latest app builds</h4>
            <h5>Want us to work on your project?</h5>
          </div>
          <div class="grid-half item">
            <div class="frame blue">
              <img src="img/slide-dailyFeed.png" alt="" />
            </div>
            <h3>DailyFeed</h3>
            <p>Your number one podcast app</p>
            <a href="#" class="button">View Project</a>
          </div>
          <div class="grid-half item">
            <div class="frame orange">
              <img src="img/slide-chitChat.png" alt="" />
            </div>
            <h3>ChitChat</h3>
            <p>The worldest easiest to use cross device chat app</p>
            <a href="#" class="button">View Project</a>
          </div>
          <div class="grid-half item">
            <div class="frame green">
              <img src="img/slide-mixTape.png" alt="" />
            </div>
            <h3>MixTape</h3>
            <p>An app to search, create and share mixtapes</p>
            <a href="#" class="button">View Project</a>
          </div>
          <div class="grid-half item">
            <div class="frame yellow">
              <img src="img/slide-kitt.png" alt="" />
            </div>
            <h3>KITT</h3>
            <p>Turn your car into KITT from Knight Rider</p>
            <a href="#" class="button">View Project</a>
          </div>
        </div><!--/main-->
        <footer>
          <div class="row">
            <div class="grid-full">
              <p>Connect with us</p>
              <ul class="social">
                <li>
                  <a href="#" class="pink"></a>
                  <a href="#" class="light-blue"></a>
                  <a href="#" class="dark-blue"></a>
                </li>
              </ul>
            </div>
          </div>
        </footer><!--/footer-->
        </div>
    </body>
    <script src="js/jquery-1.11.2.min.js"></script>
    <script src="js/animsition/jquery.animsition.min.js"></script>
    <script src="js/sticky/jquery.sticky.js"></script>
    <script src="js/main.js"></script>
</html>

I'm guessing that it has to do with amount of time it takes for the page to load?