Fix Arrow Callback

For http://stackoverflow.com/questions/31173220

HTML

<!DOCTYPE html>
<html lang="en" class="no-js">
<head>
    <meta charset="UTF-8">
    <title>Name of Website</title>
    <meta name="description" content="">
    <meta name="author" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
    <link href='http://fonts.googleapis.com/css?family=Lato:300,400,700' rel='stylesheet' type='text/css'>
    <!-- <link rel="icon" type="image/png" href="assets/img/favicon.ico"> -->
</head>
<body>

<nav>
    <progress value="0" max="100"></progress><!-- /.progress -->
    <div class="logo">
        <img src="assets/img/logo.png" alt="" class="bdnsun">
    </div><!-- .logo -->

    <div class="details">
        <p class="title">'It could have been me'</p>
        <span class="dot first">&#9679;</span>
        <span class="by">By</span>
        <span class="byline">Nancy MacDonald</span>
        <span class="dot second">&#9679;</span>
        <span class="time">Time to Read:</span>
        <span class="full">19 min</span>
    </div><!-- .details -->

    <div class="social">
        <a href=""></a>
        <a href=""></a>
        <a href=""></a>
    </div><!-- .social -->

    <div class="chapters">
        <div class="backward" id="target" title="Previous chapter"><i class="fa fa-angle-left fa-4x"></i></div><!-- /.backward -->
        <div class="forward" title="Next chapter"><i class="fa fa-angle-right fa-4x"></i></div><!-- /.forward -->
    </div><!-- .chapters -->
</nav>

<main>
    <div class="splash" id="top">
        <div class="teaser">
            <h1>'It could have been me'</h1>
            <p class="subhead">Thirteen women share their remarkable stories</p>
            <p class="byline-alt">Nancy MacDonald</p>
        </div><!-- .splash -->
    </div>

    <div class="wrapper">
        <div class="chapter chapter-1">
            <p>Wolf kale chips stumptown fanny pack, vegan kogi...

CSS

/*----------------------------------
PROJECT DETAILS
----------------------------------*/

/*Feature Template
Copyright 2015, Andrew Nguyen
Link to Project
Complete date: 03-07-2015*/

/*----------------------------------
TABLE OF CONTENTS
----------------------------------*/

/*----------------------------------
NORMALIZE
----------------------------------*/
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section, summary {
    display:block;
}
audio, canvas, video {
    display:inline-block;
}
audio:not([controls]) {
    display:none;
    height:0;
}
[hidden] {
    display:none;
}
html {
    font-family:sans-serif;
    -webkit-text-size-adjust:100%;
    -ms-text-size-adjust:100%;
}
a:focus {
    outline:thin dotted;
}
a:active, a:hover {
    outline:0;
}
h1 {
    font-size:2em;
}
abbr[title] {
    border-bottom:1px dotted;
}
b, strong {
    font-weight:700;
}
dfn {
    font-style:italic;
}
mark {
    background:#ff0;
    color:#000;
}
code, kbd, pre, samp {
    font-family:monospace, serif;
    font-size:1em;
}
pre {
    white-space:pre-wrap;
    word-wrap:break-word;
}
q {
    quotes:\201C \201D \2018 \2019;
}
small {
    font-size:80%;
}
sub, sup {
    font-size:75%;
    line-height:0;
    position:relative;
    vertical-align:baseline;
}
sup {
    top:-.5em;
}
sub {
    bottom:-.25em;
}
img {
    border:0;
}
svg:not(:root) {
    overflow:hidden;
}
fieldset {
    border:1px solid silver;
    margin:0 2px;
    padding:.35em .625em .75em;
}
button, input, select, textarea {
    font-family:inherit;
    font-size:100%;
    margin:0;
}
button, input {
    line-height:normal;
}
button, html input[type=button],
    /* 1 */
input[type=reset], input[type=submit] {
    -webkit-appearance:button;
    cursor:pointer;
}
button[disabled], input[disabled] {
    cursor:default;
}
input[type=checkbox], input[type=radio] {
    box-sizing:border-box;
    padding:0;
}
input[type=search] {
    -webkit-appearance:textfield;
   ...

JavaScript

$(function () {

  /* -------------------------------------
   GLOBAL VARIABLES
   --------------------------------------*/
  var nav = 80;
  var splash = 750 + nav;
  var NUM_CHAPTERS = 5;

  /* -------------------------------------
   GET THE CURRENT CHAPTER
   --------------------------------------*/
  function getCurrentChapter() {
    var scroll = $(window).scrollTop();
    var currentChapter = 1;
    while (currentChapter < NUM_CHAPTERS && scroll >= Math.floor($(".chapter-"+(currentChapter+1)).offset().top - nav)) {
      currentChapter++;
    }
    return currentChapter;
  }

  /* -------------------------------------
   SET THE CURRENT TITLE
   --------------------------------------*/
  function updateTitle(currentChapter) {
    var title = 'It could have been me';
    if (currentChapter == 1) {
      title = 'It could have been me';
    } else {
      title = 'Chapter ' + currentChapter ;
    }
    $(".title").html(title);
  }

  /* -------------------------------------
   PROGRESS BAR
   --------------------------------------*/
  $(window).scroll(function () {
    var scroll = $(window).scrollTop();
    var documentHeight = $(document).height();
    var windowHeight = $(window).height();
    var scrollPercent = (scroll / (documentHeight - windowHeight)) * 100;
    var position = scrollPercent;
    $("progress").attr("value", position);
    updateTitle(getCurrentChapter());
  });

  /* -------------------------------------
   ARROW CAROUSEL
   --------------------------------------*/
  $(".backward").click(function () {
    var currentChapter = getCurrentChapter();
    if (currentChapter > 1) {
      currentChapter--;
      $("body").animate({
        scrollTop: ($(".chapter-" + currentChapter).offset().top - nav),
        complete: function() {
          updateTitle(currentChapter);
        }
      }, 1000);
    }
  });

  $(".forward").click(function () {
    var currentChapter = getCurrentChapter();
    if (currentChapter < NUM_CHAPTERS) {
     ...