Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

JavaScript Using jQuery Plugins Introducing jQuery Plugins Adding a Plugin to a Web Page

Can't get animsition plugin to work.

Please help me find my mistake! I've been going crazy trying to find it.

<!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="#" class="active animsition-link">Home</a>
          <a href="work.html" class ="animsition-link">Work</a>
          <a href="team.html" class ="animsition-link">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>
 <sciprt src="js/animsition/jquery.animsition.min.js"></sciprt>
  <script src="js/main.js></script>
</body>
</html>

4 Answers

One thing you'll want to fix

 <sciprt src="js/animsition/jquery.animsition.min.js"></sciprt>

should be

 <script src="js/animsition/jquery.animsition.min.js"></script>

but even with that it still doesn't work. I can't get the workspace associated with the video to work either.

Strange, well thanks for catching that syntax error for me at the very least!

Anybody else? Still driving me nuts

Here is my entire project, if that helps https://teamtreehouse.com/workspaces/40293412

Tadakuni Yasuda
Tadakuni Yasuda
85 Points

it is not working after i checked many many many times. please help...

<!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.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 class="animsition"> <a href="#" class="active animsition-link">Home</a> <a href="work.html" class="animsition-link">Work</a> <a href="work.html" class="animsition-link">Work</a> <a href="team.html" class="animsition-link">Team</a> </nav> </div> </header> <!--/header--> <div class="row"> <div class="grid-full"></div> <div class="main row"> <div class="grid-third animsition"> <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"   class="animsition-link" >Meet the Team</a > </div> <!--/team--> <div class="grid-third animsition"> <img src="img/sticker-work.png" alt="" class="animsition-link" /> <p> Check our latest app builds or download them in the App Store. </p> <a href="work.html" class="button animsition-link" >Latest Projects</a > </div> <!--/work--> <div class="grid-third animsition"> <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 animsition-link">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 class="animsition"> <a href="#" class="pink animsition-link"></a> <a href="#" class="light-blue animsition-link"></a> <a href="#" class="dark-blue animsition-link"></a> </li> </ul> </div> </div> </footer> <!--/footer--> </div> <script src="js/jquery-1.11.2.min.js"></script> <script src="./js/animsition/jquery.animsition.js"></script> <script src="./js/main.js"></script> </body> </html>