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 Introducing jQuery Plugins Adding a Plugin to a Web Page

Asa Smith
Asa Smith
10,009 Points

Transition not working. Not loading file correctly from workspace?

The transitions work from the index.html page, but not from team.html or work.html. When I inspect the element the html isn't loading the the <link> tag or any of the "animsition" code.

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

        </div>
        <script src="js/jquery-1.11.2.min.js"></script>
      <script src="js/animsition/jquery.animsition.min.js"></script>
      <script src="js/main.js"></script>
    </body>

</html>

Double checked that files were saved, refreshed the view, shut down and reopened the view. Still no luck. Any suggestions? Thanks!

1 Answer

Asa Smith
Asa Smith
10,009 Points

So I went into the chrome inspector and manually updated the elements and now it's working. Closed and reopened the view again and it seems to be working just fine. Weird. Any thoughts on why any of this happened would be greatly appreciated. Thanks!

Yes, that happened to me too. Sometimes that happen with js, maybe the browser is the problem.