CODEWITHSUNDEEP
javascriptjquery
ShoulderMonster
ShoulderMonster

Reputation: 105

Not sure how to add Javascript code to Tumblr

I got the code from here, the main solution by rossipedia: fixed sidebar until a div

Here's my Tumblr page and the part of the code the script is influencing (main is replaced with content):

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
...

<style type="text/css">
#sidebarwrap {
  margin: 0 0 1.5em;
  width: 16.2em;
  float: left;
  position: relative;
}

 #sidebar {
  margin: 0 0 1.5em;
  width: 16em;
  height: 570px;
  position: absolute;
}

#sidebar.fixed {
  position: fixed;
  top: 0;
}

#footer {
  border-top: 4px solid {color:Footer Border};
  background: {color:Footer Background};
  color: {color:Background};
  clear: both;
  margin: 0;
  overflow: auto;
  padding: 0 0.5em;
}

#content {
  margin-bottom: 4.5em;
  margin-left: 18.5em;
  min-width: 500px;
  min-height: 550px;
}
</style>
</head>

Body

<body>
<div id="contain">
    <div id="sidebarwrap">
    <div id="sidebar">
    ...Stuff...
    </div>
    </div>

    <div id="content">
    ...Stuff...
    </div>
</div>

<div id="footer">
<div id="footer-container">
...Stuff...
</div>
</div>

I then included the the script right before the /body as so:

<script type="text/javascript">
    ...Script...
</script>

I keep spell checking and making sure everything is in order, but it all just won't work. At least not for that JS. The other JS's I used work just fine... The script is supposed to make my side bar scroll with the user and then stop right before overlapping the footer. Yet, the script acts likes its not even there, the sidebar doesn't move a single inch... Heck, I even tampered with the original on its Fiddle page to make it the same layout and ordering as my page, and it still worked just fine.

Am I missing something? Everyone keeps talking about JQuery, and I'm not entirely sure what that is or if I'm supposed to use it... If someone could help me see what I'm doing wrong, I'd really appreciate it! :'D

Upvotes: 0

Views: 4685

Answers (1)

Ben
Ben

Reputation: 1701

It looks like you do need to load jQuery on your page to use the code you added. jQuery is a JavaScript library; it provides the "$" function.

To load jQuery in your page, add this before your fixed sidebar code:

<!-- Note that we have a closing tag right after the opening tag here. -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<script>
    // Your code here
</script>

Upvotes: 4

Related Questions