We Keep Coding

HTML file would not compile

I want to make a typewriter affect using JavaScript\ for my personal website. I found a template of this online and used the exact template to make some changes and edit it. However, it would not compile on another ide for example repl.it. I believe there is something wrong with the html file code, and I am not able to figure out what's wrong since I am new to html.
Here on this IDE, it works:
HTML FILE:
body /*What do I put here to make this html code run properly?*/
p.typeIt
CSS FILE:
body {
height: 100%;
background: seagreen;
}
body p {
color: bisque;
width: 100%;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -100%);
transform: translate(-50%, -100%);
text-align: center;
font-family: opens sans, helvetica;
font-size: 50px;
font-weight: 600;
}
JS FILE:
!(function (t, e) {
"use strict";
var i = t(document);
(t.fn.typeIt = function (i) {
return this.each(function () {
var s = t(this),
h = s.data("typeit");
h !== e &&
(clearTimeout(h.tTO), clearTimeout(h.dTO), s.removeData("typeit")),
s.data("typeit", new t.typeIt(s, i));
});
}),
(t.typeIt = function (i, s) {
(this.d = {
strings: [],
speed: 100,
deleteSpeed: e,
lifeLike: !0,
cursor: !0,
cursorSpeed: 1e3,
breakLines: !0,
breakDelay: 750,
deleteDelay: 750,
startDelay: 250,
startDelete: !1,
loop: !1,
loopDelay: 750,
html: !0,
autoStart: !0,
callback: function () { }
}),
(this.queue = []),
(this.queueIndex = 0),
(this.hasStarted = !1),
(this.inTag = !1),
(this.stringsToDelete = ""),
(this.style =
'style="display:inline;position:relative;font:inherit;color:inherit;"'),
(this.s = t.extend({}, this.d, s)),
(this.el = i),
this._init();
}),
(t.typeIt.prototype = {
_init: function () {
this.el.find(".ti-container, .ti-cursor, .ti-placeholder").remove(),
this._elCheck(),
(this.s.strings = this._toArray(this.s.strings)),
this.el.html(
'<i class="ti-placeholder" style="display:inline-block;width:0;line-height:0;overflow:hidden;">.</i><span ' +
this.style +
' class="ti-container"></span>'
),
(this.tel = this.el.find("span")),
(this.insert = function (t) {
this.tel.append(t);
}),
this.s.startDelete &&
(this.tel.html(this.stringsToDelete),
this.queue.push([this["delete"]])),
this._generateQueue(),
this._kickoff();
},
_kickoff: function () {
this._cursor(),
this.s.autoStart
? this._startQueue()
: this._isVisible()
? ((this.hasStarted = !0), this._startQueue())
: i.on(
"scroll",
function () {
this._isVisible() &&
!this.hasStarted &&
((this.hasStarted = !0), this._startQueue());
}.bind(this)
);
},
_generateQueue: function () {
for (var t = 0; t < this.s.strings.length; t++)
if (
(this.queue.push([this.type, this.s.strings[t]]),
t < this.s.strings.length - 1)
) {
var e = this.queue.length,
i = this.s.breakLines ? this.s.breakDelay : this.s.deleteDelay;
this.queue.push([
this.s.breakLines ? this["break"] : this["delete"]
]),
this.queue.splice(e, 0, [this.pause, i / 2]),
this.queue.splice(e + 2, 0, [this.pause, i / 2]);
}
},
_startQueue: function () {
this._to(
function () {
this._executeQueue();
}.bind(this),
this.s.startDelay
);
},
type: function (t, e) {
(e = "undefined" == typeof e || e),
(t = this._toArray(t)),
e && ((t = this._rake(t)), (t = t[0])),
(this.tTO = setTimeout(
function () {
if (
(this._setPace(this),
this.s.html &&
t[0].indexOf("<") !== -1 &&
t[0].indexOf("</") === -1 &&
!this.inTag)
) {
for (var e = t.length - 1; e >= 0; e--)
t[e].indexOf("</") !== -1 &&
((this.tagCount = 1), (this.tagDuration = e));
this._makeNode(t[0]);
} else this._print(t[0]);
t.splice(0, 1),
t.length ? this.type(t, !1) : this._executeQueue();
}.bind(this),
this.typePace
));
},
pause: function (t) {
(t = t === e ? this.s.breakDelay : t),
this._to(
function () {
this._executeQueue();
}.bind(this),
t
);
},
break: function () {
this.insert("<br>"), this._executeQueue();
},
mergeSet: function (e) {
(this.s = t.extend({}, this.s, e)), this._executeQueue();
},
_print: function (e) {
this.inTag
? (t(this.tag, this.el).last().append(e),
this.tagCount < this.tagDuration
? this.tagCount++
: (this.inTag = !1))
: this.insert(e);
},
delete: function (t) {
this.deleteTimeout = setTimeout(
function () {
this._setPace();
for (
var i = this.tel.html().split(""),
s = t === e || null === t ? i.length - 1 : t + 1,
h = i.length - 1;
h > -1;
h--
) {
if ((">" !== i[h] && ";" !== i[h]) || !this.s.html) {
i.pop();
break;
}
for (var n = h; n > -1; n--) {
if ("<br>" === i.slice(n - 3, n + 1).join("")) {
i.splice(n - 3, 4);
break;
}
if ("&" === i[n]) {
i.splice(n, h - n + 1);
break;
}
if ("<" === i[n] && ">" !== i[n - 1]) {
if (";" === i[n - 1])
for (var r = n - 1; r > -1; r--)
if ("&" === i[r]) {
i.splice(r, n - r);
break;
}
i.splice(n - 1, 1);
break;
}
}
break;
}
if (this.tel.html().indexOf("></") > -1)
for (var a = this.tel.html().indexOf("></") - 2; a >= 0; a--)
if ("<" === i[a]) {
i.splice(a, i.length - a);
break;
}
this.tel.html(i.join("")),
s > (t === e ? 0 : 2)
? this["delete"](t === e ? e : t - 1)
: this._executeQueue();
}.bind(this),
this.deletePace
);
},
_isVisible: function () {
var e = t(window),
i = { top: e.scrollTop(), left: e.scrollLeft() };
(i.right = i.left + e.width()), (i.bottom = i.top + e.height());
var s = this.el.outerHeight(),
h = this.el.outerWidth();
if (!h || !s) return !1;
var n = this.el.offset();
(n.right = n.left + h), (n.bottom = n.top + s);
var r = !(
i.right < n.left ||
i.left > n.right ||
i.bottom < n.top ||
i.top > n.bottom
);
if (!r) return !1;
var a = {
top: Math.min(1, (n.bottom - i.top) / s),
bottom: Math.min(1, (i.bottom - n.top) / s),
left: Math.min(1, (n.right - i.left) / h),
right: Math.min(1, (i.right - n.left) / h)
};
return a.left * a.right >= 1 && a.top * a.bottom >= 1;
},
_executeQueue: function () {
if (this.queueIndex < this.queue.length) {
var t = this.queue[this.queueIndex];
this.queueIndex++ ,
this.isLooping && 1 === this.queueIndex
? this._to(
function () {
t[0].bind(this)(t[1]);
}.bind(this),
this.s.loopDelay / 2
)
: t[0].bind(this)(t[1]);
} else
this.s.loop
? ((this.queueIndex = 0),
(this.isLooping = !0),
this._to(
function () {
this["delete"]();
}.bind(this),
this.s.loopDelay / 2
))
: this.s.callback();
},
_to: function (t, e) {
setTimeout(
function () {
t();
}.bind(this),
e
);
},
_elCheck: function () {
!this.s.startDelete &&
this.el.html().replace(/(\r\n|\n|\r)/gm, "").length > 0
? (this.s.strings = this.el.html().trim())
: this.s.startDelete && (this.stringsToDelete = this.el.html());
},
_toArray: function (t) {
return t.constructor === Array ? t.slice(0) : t.split("<br>");
},
_cursor: function () {
if (this.s.cursor) {
this.el.append("<span " + this.style + 'class="ti-cursor">|</span>');
var t = this.s.cursorSpeed,
e = this;
!(function i() {
e.el
.find(".ti-cursor")
.fadeTo(t / 2, 0)
.fadeTo(t / 2, 1),
e._to(i, t);
})();
}
},
_setPace: function () {
var t = this.s.speed,
i = this.s.deleteSpeed !== e ? this.s.deleteSpeed : this.s.speed / 3,
s = t / 2,
h = i / 2;
(this.typePace = this.s.lifeLike ? this._randomInRange(t, s) : t),
(this.deletePace = this.s.lifeLike ? this._randomInRange(i, h) : i);
},
_randomInRange: function (t, e) {
return Math.abs(Math.random() * (t + e - (t - e)) + (t - e));
},
_rake: function (t) {
for (var e = 0; e < t.length; e++)
if (((t[e] = t[e].split("")), this.s.html)) {
this.tPos = [];
for (var i, s = this.tPos, h = !1, n = 0; n < t[e].length; n++)
("<" !== t[e][n] && "&" !== t[e][n]) ||
((s[0] = n), (h = "&" === t[e][n])),
(">" === t[e][n] || (";" === t[e][n] && h)) &&
((s[1] = n),
(n = 0),
(i = t[e].slice(s[0], s[1] + 1).join("")),
t[e].splice(s[0], s[1] - s[0] + 1, i),
(h = !1));
}
return t;
},
_makeNode: function (e) {
(this.tag = t(t.parseHTML(e))),
this._print(this.tag),
(this.inTag = !0);
}
}),
(t.fn.tiType = function (s) {
var h = t(this).data("typeit");
return h === e ? i : (h.queue.push([h.type, s]), this);
}),
(t.fn.tiDelete = function (s) {
var h = t(this).data("typeit");
return h === e ? i : (h.queue.push([h["delete"], s]), this);
}),
(t.fn.tiPause = function (s) {
var h = t(this).data("typeit");
return h === e ? i : (h.queue.push([h.pause, s]), this);
}),
(t.fn.tiBreak = function () {
var s = t(this).data("typeit");
return s === e ? i : (s.queue.push([s["break"]]), this);
}),
(t.fn.tiSettings = function (s) {
var h = t(this).data("typeit");
return h === e ? i : (h.queue.push([h.mergeSet, s]), this);
});
})(jQuery);
$(".typeIt")
.typeIt({
speed: 100,
autoStart: false
})
.tiType("Hi,")
.tiPause(600)
.tiType(" My name is Gazi Taufiq.")
.tiBreak()
.tiPause(1000)
.tiSettings({ speed: 300 })
.tiType("I am a")
.tiSettings({ speed: 75 })
.tiType(" Web Developer")
.tiPause(800)
.tiDelete(15)
.tiType("an Artist")
.tiPause(1200)
.tiDelete(8)
.tiType(" Coder.")
.tiPause(2000)
.tiDelete()
.tiType("Feel free to contact me")
.tiPause(600)
.tiType(" and we may work together. ")
.tiPause(600)
.tiType(":)");
What can I try to resolve this?

You put arrows around body, put an opening and closing parenthesis at the end of p.typeIt, and put a <script> tag above (or below too, but you need a slash (/) character before the script tag on the bottom) p.typeIt().
I think almost all HTML tags have arrows behind and in front of them.

Insert z-index css property in Swiped.min.js file

am facing problem regarding style property, set by some element in "swiped.min.js".
It is defining css property transition & transform when i click a button. I want to add one more property to it z-index.
I have been trying to work around it with no success yet. I am just a beginner in js, would appreciate if anyone could point out how to add z-index to list.
! function() {
function t(t, e) {
document.addEventListener(t, function(t) {
a._elems.forEach(function(i) {
for (var n = t.target; n;) {
if (n === i.elem) return i[e](t), !1;
n = n.parentNode
}
return !1
})
})
}
function e() {
var t = [].shift.call(arguments),
e = arguments[0];
for (var i in e) e.hasOwnProperty(i) && (t[i] = e[i]);
return t
}
var i = window.navigator.msPointerEnabled,
n = {
start: i ? "MSPointerDown" : "touchstart",
move: i ? "MSPointerMove" : "touchmove",
end: i ? "MSPointerUp" : "touchend"
},
o = function() {
var t = window.getComputedStyle(document.documentElement, ""),
e = (Array.prototype.slice.call(t).join("").match(/-(moz|webkit|ms)-/) || "" === t.OLink && ["", "o"])[1];
return "-" + e + "-"
}(),
s = function() {
var t, e = document.createElement("fakeelement"),
i = {
transition: "transitionend",
OTransition: "oTransitionEnd",
MozTransition: "transitionend",
WebkitTransition: "webkitTransitionEnd"
};
for (t in i)
if (void 0 !== e.style[t]) return i[t]
}(),
r = {
transition: o + "transition",
transform: o + "transform"
},
h = function() {},
a = function(t) {
var i = {
duration: 200,
tolerance: 50,
time: 200,
dir: 1,
right: 0,
left: 0
};
t = e(i, t || {}), this.duration = t.duration, this.tolerance = t.tolerance, this.time = t.time, this.width = t.left || t.right, this.elem = t.elem, this.list = t.list, this.dir = t.dir, this.group = t.group, this.id = a.elemId++, this.onOpen = "function" == typeof t.onOpen ? t.onOpen : h, this.onClose = "function" == typeof t.onClose ? t.onClose : h, this.right = t.right, this.left = t.left, (t.right > 0 && t.tolerance > t.right || t.left > 0 && t.tolerance > t.left) && console.warn("tolerance must be less then left and right")
};
a._elems = [], a.groupCounter = 0, a.elemId = 0, a.init = function(t) {
a.groupCounter++;
var i = document.querySelectorAll(t.query),
n = [];
return delete t.query, [].forEach.call(i, function(i) {
var o = e({
elem: i,
group: a.groupCounter
}, t);
n.push(new a(o))
}), a._bindEvents(), a._elems = a._elems.concat(n), 1 === n.length ? n[0] : n
}, a._closeAll = function(t) {
a._elems.forEach(function(e) {
e.group === t && e.close(!0)
})
}, a.prototype.transitionEnd = function(t, e) {
function i() {
e.call(n), t.removeEventListener(s, i)
}
var n = this;
t.addEventListener(s, i)
}, a.prototype.touchStart = function(t) {
var e = t.changedTouches[0];
1 === t.touches.length && (this.touchId = e.identifier, this.x = e.pageX, this.y = e.pageY, this.startTime = new Date, this.resetValue(), this.list ? a._closeAll(this.group) : this.close(!0))
}, a.prototype.touchMove = function(t) {
var e = t.changedTouches[0];
this.isValidTouch(t) && (this.delta = e.pageX - this.x, this.dir = this.delta < 0 ? -1 : 1, this.width = this.delta < 0 ? this.right : this.left, this.defineUserAction(e), this.startSwipe && (this.move(), t.preventDefault()))
}, a.prototype.touchEnd = function(t) {
this.isValidTouch(t, !0) && this.startSwipe && (this.dir * this.delta > this.tolerance || new Date - this.startTime < this.time ? this.open() : this.close(), t.stopPropagation(), t.preventDefault())
}, a.prototype.open = function(t) {
this.animation(this.dir * this.width), this.swiped = !0, t || this.transitionEnd(this.elem, this.onOpen), this.resetValue()
}, a.prototype.close = function(t) {
this.animation(0), this.swiped = !1, t || this.transitionEnd(this.elem, this.onClose), this.resetValue()
}, a.prototype.toggle = function() {
this.swiped ? this.close() : this.open()
}, a.prototype.resetValue = function() {
this.startSwipe = !1, this.startScroll = !1, this.delta = 0
}, a._bindEvents = function() {
return a.eventBinded ? !1 : (t(n.move, "touchMove"), t(n.end, "touchEnd"), t(n.start, "touchStart"), void(a.eventBinded = !0))
}, a.prototype.defineUserAction = function(t) {
var e = 10,
i = 10;
Math.abs(this.y - t.pageY) > i && !this.startSwipe ? this.startScroll = !0 : Math.abs(this.delta) > e && !this.startScroll && (this.startSwipe = !0)
}, a.prototype.isValidTouch = function(t, e) {
var i = e ? "changedTouches" : "targetTouches";
return t[i][0].identifier === this.touchId
}, a.prototype.move = function() {
if (this.dir > 0 && (this.delta < 0 || 0 === this.left) || this.dir < 0 && (this.delta > 0 || 0 === this.right)) return !1;
var t = Math.abs(this.delta);
t > this.width && (this.delta = this.dir * (this.width + (t - this.width) / 8)), this.animation(this.delta, 0)
}, a.prototype.animation = function(t, e) {
e = void 0 === e ? this.duration : e, this.elem.style.cssText = r.transition + ":" + r.transform + " " + e + "ms; " + r.transform + ":translate3d(" + t + "px, 0px, 0px)"
}, a.prototype.destroy = function(t) {
var e = this.id;
a._elems.forEach(function(t, i) {
t.id === e && a._elems.splice(i, 1)
}), t && this.elem.parentNode.removeChild(this.elem)
}, window.Swiped = a
}();

! function() {
function t(t, e) {
document.addEventListener(t, function(t) {
a._elems.forEach(function(i) {
for (var n = t.target; n;) {
if (n === i.elem) return i[e](t), !1;
n = n.parentNode
}
return !1
})
})
}
function e() {
var t = [].shift.call(arguments),
e = arguments[0];
for (var i in e) e.hasOwnProperty(i) && (t[i] = e[i]);
return t
}
var i = window.navigator.msPointerEnabled,
n = {
start: i ? "MSPointerDown" : "touchstart",
move: i ? "MSPointerMove" : "touchmove",
end: i ? "MSPointerUp" : "touchend"
},
o = function() {
var t = window.getComputedStyle(document.documentElement, ""),
e = (Array.prototype.slice.call(t).join("").match(/-(moz|webkit|ms)-/) || "" === t.OLink && ["", "o"])[1];
return "-" + e + "-"
}(),
s = function() {
var t, e = document.createElement("fakeelement"),
i = {
transition: "transitionend",
OTransition: "oTransitionEnd",
MozTransition: "transitionend",
WebkitTransition: "webkitTransitionEnd"
};
for (t in i)
if (void 0 !== e.style[t]) return i[t]
}(),
r = {
transition: o + "transition",
transform: o + "transform"
},
h = function() {},
a = function(t) {
var i = {
duration: 200,
tolerance: 50,
time: 200,
dir: 1,
right: 0,
left: 0
};
t = e(i, t || {}), this.duration = t.duration, this.tolerance = t.tolerance, this.time = t.time, this.width = t.left || t.right, this.elem = t.elem, this.list = t.list, this.dir = t.dir, this.group = t.group, this.id = a.elemId++, this.onOpen = "function" == typeof t.onOpen ? t.onOpen : h, this.onClose = "function" == typeof t.onClose ? t.onClose : h, this.right = t.right, this.left = t.left, (t.right > 0 && t.tolerance > t.right || t.left > 0 && t.tolerance > t.left) && console.warn("tolerance must be less then left and right")
};
a._elems = [], a.groupCounter = 0, a.elemId = 0, a.init = function(t) {
a.groupCounter++;
var i = document.querySelectorAll(t.query),
n = [];
return delete t.query, [].forEach.call(i, function(i) {
var o = e({
elem: i,
group: a.groupCounter
}, t);
n.push(new a(o))
}), a._bindEvents(), a._elems = a._elems.concat(n), 1 === n.length ? n[0] : n
}, a._closeAll = function(t) {
a._elems.forEach(function(e) {
e.group === t && e.close(!0)
})
}, a.prototype.transitionEnd = function(t, e) {
function i() {
e.call(n), t.removeEventListener(s, i)
}
var n = this;
t.addEventListener(s, i)
}, a.prototype.touchStart = function(t) {
var e = t.changedTouches[0];
1 === t.touches.length && (this.touchId = e.identifier, this.x = e.pageX, this.y = e.pageY, this.startTime = new Date, this.resetValue(), this.list ? a._closeAll(this.group) : this.close(!0))
}, a.prototype.touchMove = function(t) {
var e = t.changedTouches[0];
this.isValidTouch(t) && (this.delta = e.pageX - this.x, this.dir = this.delta < 0 ? -1 : 1, this.width = this.delta < 0 ? this.right : this.left, this.defineUserAction(e), this.startSwipe && (this.move(), t.preventDefault()))
}, a.prototype.touchEnd = function(t) {
this.isValidTouch(t, !0) && this.startSwipe && (this.dir * this.delta > this.tolerance || new Date - this.startTime < this.time ? this.open() : this.close(), t.stopPropagation(), t.preventDefault())
}, a.prototype.open = function(t) {
this.animation(this.dir * this.width), this.swiped = !0, t || this.transitionEnd(this.elem, this.onOpen), this.resetValue()
}, a.prototype.close = function(t) {
this.animation(0), this.swiped = !1, t || this.transitionEnd(this.elem, this.onClose), this.resetValue()
}, a.prototype.toggle = function() {
this.swiped ? this.close() : this.open()
}, a.prototype.resetValue = function() {
this.startSwipe = !1, this.startScroll = !1, this.delta = 0
}, a._bindEvents = function() {
return a.eventBinded ? !1 : (t(n.move, "touchMove"), t(n.end, "touchEnd"), t(n.start, "touchStart"), void(a.eventBinded = !0))
}, a.prototype.defineUserAction = function(t) {
var e = 10,
i = 10;
Math.abs(this.y - t.pageY) > i && !this.startSwipe ? this.startScroll = !0 : Math.abs(this.delta) > e && !this.startScroll && (this.startSwipe = !0)
}, a.prototype.isValidTouch = function(t, e) {
var i = e ? "changedTouches" : "targetTouches";
return t[i][0].identifier === this.touchId
}, a.prototype.move = function() {
if (this.dir > 0 && (this.delta < 0 || 0 === this.left) || this.dir < 0 && (this.delta > 0 || 0 === this.right)) return !1;
var t = Math.abs(this.delta);
t > this.width && (this.delta = this.dir * (this.width + (t - this.width) / 8)), this.animation(this.delta, 0)
}, a.prototype.animation = function(t, e) {
e = void 0 === e ? this.duration : e, this.elem.style.cssText = r.transition + ":" + r.transform + " " + e + "ms; " + r.transform + ":translate3d(" + t + "px, 0px, 0px);" + " " + "z-index: 10000;"
}, a.prototype.destroy = function(t) {
var e = this.id;
a._elems.forEach(function(t, i) {
t.id === e && a._elems.splice(i, 1)
}), t && this.elem.parentNode.removeChild(this.elem)
}, window.Swiped = a
}();
You can add z-index to this line of code
e = void 0 === e ? this.duration : e, this.elem.style.cssText = r.transition + ":" + r.transform + " " + e + "ms; " + r.transform + ":translate3d(" + t + "px, 0px, 0px);" + " " + "z-index: 10000"

Make a Section take up full screen

in my html code, i have the following:
<section id="cta">
.......
</section>
<!-- Footer -->
<footer id="footer">
......
</footer>
How do i actually make my section take up the whole screen when the page loads, whereas the footer actually goes down to a scrollbar. Note that this has to be dynamic since different computers have different screen sizes, i know of the height 100% trick, but in my case there are multiple elements, and is it possible to make a specific one take up the whole screen whereas the other one can be accessed via scroll?
Thanks!
I actually tried removing a js script, and it worked, so i suspect its some css defined inside the js script, but i cant seem to find which is the conflicting css, i tried to add !important to my current css, but it does not overide the one in the js script.
Here is the JS script:
/* skel-layers.js v1.0.4 | (c) n33 | getskel.com | MIT licensed */
(function(e) {
typeof define == "function" && define.amd ? define(["jquery", "skel"], e) : e(jQuery, skel)
})(function(e, t) {
...
...
}
var t;
return typeof e == gt ? H : (e.fn[p] = function() {
var t, n;
if (this[z] > 1) {
for (t = 0; t < this[z]; t++) e(this[t])[p]();
return e(this)
}
return n = e(this), n[S](it, n.data(A)).data(A, ""), n
}, e.fn[Ct] = function() {
var t = e(this),
n = t.parent(),
r = 12;
n[M]().each(function() {
var t = e(this),
n = t[Lt]("class");
n && n.match(/(\s+|^)([0-9]+)u(\s+|$)/) && (r -= parseInt(RegExp.$2))
}), r > 0 && (t[ct](), t[S](E, (t.data(Jt) + r) / 12 * 100 + "%"))
}, e.fn[Ot] = function() {
return e(this).parents()[z] > 0
}, e.fn[ct] = function() {
var t = e(this);
t[Lt]("class").match(/(\s+|^)([0-9]+)u(\s+|$)/) && t.data(Jt, parseInt(RegExp.$2))
}, e.fn[c] = function(r) {
var i, s, o;
if (this[z] > 1) {
for (i = 0; i < this[z]; i++) e(this[i])[c](r);
return e(this)
}
return s = e(this), isNaN(o = parseInt(s.data(ot))) && (o = 0), s.data(A, s[S](it))[S](it, t[n].baseZIndex + o + (r ? r : 1)), s
}, e.fn[u] = function() {
var t = e(this);
return e(this)[At]("form").each(function() {
this.reset()
}), t
}, e.fn[qt] = function(t, n) {
return e(this)[S](t, n)[S](Tt + t, Tt + n)[S](K + t, K + n)[S](Rt + t, Rt + n)[S](Dt + t, Dt + n)
}, e.fn._skel_layers_xcssProperty = function(t, n) {
return e(this)[S](t, n)[S](Tt + t, n)[S](K + t, n)[S](Rt + t, n)[S](Dt + t, n)
}, e.fn._skel_layers_xcssValue = function(t, n) {
return e(this)[S](t, n)[S](t, Tt + n)[S](t, K + n)[S](t, Rt + n)[S](t, Dt + n)
}, Nn[C][lt] = {
none: {
show: function(e) {
var t = e[n],
r = e[h];
r[B](0)[c](t.zIndex)[nn](), t[$] && r[u](), e[d]()
},
hide: function(e) {
var t = e[n],
r = e[h];
r[It]()[p](), e[m]()
}
},
overlayX: {
show: function(e) {
var r = e[n],
i = e[h];
i[B](0)[c](r.zIndex)[S](r[en], Gt + t[Q](t._[w](r[E])) + Qt)[nn](), r[$] && i[u](), t[Ht](sn), e[d](), window[v](function() {
i[s]((r[en] == g ? Gt : "") + t[Q](t._[w](r[E])), 0)
}, 50)
},
hide: function(e) {
var i = e[n],
s = e[h];
s[At](an)[Xt](Nt, [J]), s[r](), window[v](function() {
t[ft](sn), e[m](), s[p]()[It]()
}, t[n][dt] + 50)
}
},
overlayY: {
show: function(e) {
var r = e[n],
i = e[h];
i[B](0)[c](r.zIndex)[S](r[en], Gt + t[Q](t._[w](r[U])) + Qt)[nn](), r[$] && i[u](), t[Ht]("y"), e[d](), window[v](function() {
i[s](0, (r[en] == y ? Gt : "") + t[Q](t._[w](r[U])))
}, 50)
},
hide: function(e) {
var i = e[n],
s = e[h];
s[At](an)[Xt](Nt, [J]), s[r](), window[v](function() {
t[ft]("y"), e[m](), s[p]()[It]()
}, t[n][dt] + 50)
}
},
pushX: {
show: function(e) {
var r = e[n],
a = e[h],
f = t[i][L].add(t[i][o][M]());
a[B](0)[S](r[en], Gt + t[Q](t._[w](r[E])) + Qt)[nn](), r[$] && a[u](), f[c](), t[Ht](sn), e[d](), window[v](function() {
a.add(f)[s]((r[en] == g ? Gt : "") + t[Q](t._[w](r[E])), 0)
}, 50)
},
hide: function(e) {
var s = e[n],
u = e[h],
a = t[i][L].add(t[i][o][M]());
u[At](an)[Xt](Nt, [J]), u.add(a)[r](), window[v](function() {
t[ft](sn), u[It](), e[m](), a[p]()
}, t[n][dt] + 50)
}
},
pushY: {
show: function(e) {
var r = e[n],
a = e[h],
f = t[i][L].add(t[i][o][M]());
a[B](0)[S](r[en], Gt + t[Zt](t._[w](r[U])) + Qt)[nn](), r[$] && a[u](), t[Ht]("y"), e[d](), window[v](function() {
a.add(f)[s](0, (r[en] == y ? Gt : "") + t[Zt](t._[w](r[U])))
}, 50)
},
hide: function(e) {
var s = e[n],
u = e[h],
a = t[i][L].add(t[i][o][M]());
u[At](an)[Xt](Nt, [J]), u.add(a)[r](), window[v](function() {
t[ft]("y"), u[It](), e[m]()
}, t[n][dt] + 50)
}
},
revealX: {
show: function(e) {
var r = e[n],
a = e[h],
f = t[i][L].add(t[i][o][M]());
a[B](0)[nn](), r[$] && a[u](), f[c](), t[Ht](sn), e[d](), window[v](function() {
f[s]((r[en] == g ? Gt : "") + t[Q](t._[w](r[E])), 0)
}, 50)
},
hide: function(e) {
var s = e[n],
u = e[h],
a = t[i][L].add(t[i][o][M]());
u[At](an)[Xt](Nt, [J]), a[r](), window[v](function() {
t[ft](sn), u[It](), a[p](), e[m]()
}, t[n][dt] + 50)
}
}
}, Nn[C][bt] = {
"top-left": {
v: R,
h: k,
side: k
},
"top-right": {
v: R,
h: g,
side: g
},
top: {
v: R,
h: T,
side: R
},
"top-center": {
v: R,
h: T,
side: R
},
"bottom-left": {
v: y,
h: k,
side: k
},
"bottom-right": {
v: y,
h: g,
side: g
},
bottom: {
v: y,
h: T,
side: y
},
"bottom-center": {
v: y,
h: T,
side: y
},
left: {
v: T,
h: k,
side: k
},
"center-left": {
v: T,
h: k,
side: k
},
right: {
v: T,
h: g,
side: g
},
"center-right": {
v: T,
h: g,
side: g
}
}, Nn[C][nn] = function() {
var e, r, s, u, a;
if (this[W]) {
t[i][o][ht](this[j]);
return
}
e = this, r = this[n], s = t._[w](r[tt]), u = this[h], u[S](E, t._[w](r[E]))[S](U, t._[w](r[U])), t._.vars[Mt] == "ios" && (r[U] == "100%" && !r[rt] && u[S](U, "-webkit-calc(" + t._[w](r[U]) + " + 70px)"), u.on(Nt, "input,select,textarea", function(n, r) {
if (r) return;
window[v](function() {
t[i][P][ht](e[j]), window[v](function() {
t[i][o][ht](e[j])
}, 500)
}, 500)
})), a = this[bt][r[b]], u[Bt]("skel-layer-" + r[b]).data(st, r[b]);
switch (a.v) {
case R:
u[S](R, 0);
break;
case y:
u[S](y, 0);
break;
case T:
u[S](R, "50%")[S]("margin-top", Gt + t.getHalf(r[U]))
}
switch (a.h) {
case k:
u[S](k, 0);
break;
case g:
u[S](g, 0);
break;
case T:
u[S](k, "50%")[S]("margin-left", Gt + t.getHalf(r[E]))
}
this[lt][s][nn](this), r[rt] && r.exclusive && (t[i][Kt][Bt](Y), t[i][l] = this), this[W] = J
}, Nn[C][It] = function() {
var e, r;
if (!this[W]) {
t[i][P][ht](this[j]);
return
}
e = this[n], r = t._[w](e[tt]), r in this[lt] || (r = yt), this[lt][r][It](this), e[rt] && e.exclusive && t[i][l] === this && (t[i][Kt][Wt](Y), t[i][l] = x), this[W] = H
}, Nn[C].init = function() {
var r = this[n],
i = e(this[j]),
s = this;
i[O](), i[At](an).each(function() {
t.parseInit(e(this))
}), i[Bt]("skel-layer").data(ot, this.index)[S](it, t[n].baseZIndex)[S](b, "fixed")[S]("-ms-overflow-style", "-ms-autohiding-scrollbar")[S]("-webkit-overflow-scrolling", "touch")[It]();
switch (r.orientation) {
case "vertical":
i[S]("overflow-y", Ft);
break;
case "horizontal":
i[S](D, Ft);
break;
case yt:
default:
}
if (!r[b] || !(r[b] in this[bt])) r[b] = "top-left";
r[en] || (r[en] = this[bt][r[b]][en]);
if (!r[tt] || typeof r[tt] !== $t && !(r[tt] in this[lt])) r[tt] = yt;
r.clickToHide && i[At]("a")[S](nt, zt).on("click.skel-layers", function(r) {
var i, o, u = e(this);
if (u.hasClass("skel-layers-ignore")) return;
r[kt](), r[Et](), s[It]();
if (u.hasClass("skel-layers-ignoreHref")) return;
i = u[Lt]("href"), o = u[Lt]("target"), typeof i !== gt && i != "" && window[v](function() {
o == "_blank" && t._.vars[Mt] != "wp" ? window.open(i) : window.location.href = i
}, t[n][dt] + 10)
}), i.on("touchstart", function(e) {
s[St] = e[et][tn][0].pageX, s[xt] = e[et][tn][0].pageY
}).on("touchmove", function(e) {
var t, n, o, u, a, f, l;
if (s[St] === x || s[xt] === x) return;
t = s[St] - e[et][tn][0].pageX, n = s[xt] - e[et][tn][0].pageY, o = i.outerHeight(), u = i.get(0).scrollHeight - i[B]();
if (r[rt] && r.swipeToHide) {
a = H, f = 20, l = 50;
switch (r[en]) {
case k:
a = n < f && n > -1 * f && t > l;
break;
case g:
a = n < f && n > -1 * f && t < -1 * l;
break;
case R:
a = t < f && t > -1 * f && n > l;
break;
case y:
a = t < f && t > -1 * f && n < -1 * l
}
if (a) return s[St] = x, s[xt] = x, s[It](), H
}
if (i[B]() == 0 && n < 0 || u > o - 2 && u < o + 2 && n > 0) return H
}), this[h] = i
}, Nn[C][Z] = function() {
return this[h] !== x
}, Nn[C][Yt] = function() {
return this[h].is(":visible")
}, Nn[C][d] = function() {
t[i][o][ht](this[h])
}, Nn[C][m] = function() {
if (!this[h][Ot]()) return;
t[i][P][ht](this[h])
}, Nn[C].resume = function(r) {
if (!this[Z]()) return;
this[h][At](an).each(function() {
t.parseResume(e(this))
}), this[n][rt] || this[nn](r)
}, Nn[C].suspend = function() {
if (!this[Z]()) return;
this[h][r](), this[h][At](an).each(function() {
t.parseSuspend(e(this))
}), this[W] && this[It]()
}, t = {
cache: {
visibleWrapper: x,
body: x,
exclusiveLayer: x,
html: x,
htmlbody: x,
hiddenWrapper: x,
layers: {},
window: x,
wrapper: x
},
config: {
baseZIndex: 1e4,
layers: {},
speed: 250,
transform: J,
transformBreakpoints: x,
transformTest: x
},
eventType: "click touchend",
show: function(e) {
t._[Pt](function() {
t[i][I][e][nn]()
})
},
hide: function(e) {
t._[Pt](function() {
t[i][I][e][It]()
})
},
toggle: function(e) {
t._[Pt](function() {
var n = t[i][I][e];
n[Yt]() ? n[It]() : n[nn]()
})
},
getBaseFontSize: function() {
return t._.vars.IEVersion < 9 ? 16.5 : parseFloat(getComputedStyle(t[i][Kt].get(0)).fontSize)
},
getHalf: function(e) {
var t = parseInt(e);
return typeof e == "string" && e.charAt(e[z] - 1) == "%" ? Math.floor(t / 2) + "%" : Math.floor(t / 2) + Qt
},
lockView: function(e) {
t[i][wt]._skel_layers_scrollPos = t[i][wt][B](), e == sn && t[i][on][S](D, rt), t[i][L].on(X, function(e) {
e[kt](), e[Et](), t[i][l] && t[i][l][It]()
}), t[i][wt].on(mt, function(e) {
t[i][l] && t[i][l][It]()
}), t._.vars.isMobile || window[v](function() {
t[i][wt].on(vt, function(e) {
t[i][l] && t[i][l][It]()
})
}, t[n][dt] + 50)
},
parseInit: function(n) {
var r, s, o = n.get(0),
u = n[Lt]("data-action"),
a = n[Lt]("data-args"),
c, h;
u && a && (a = a.split(","));
switch (u) {
case "toggleLayer":
case "layerToggle":
n[S](nt, zt)[S]("cursor", "pointer"), r = function(n) {
n[kt](), n[Et]();
if (t[i][l]) return t[i][l][It](), H;
var r = e(this),
s = t[i][I][a[0]];
s[Yt]() ? s[It]() : s[nn]()
}, n.on(t.eventType, r);
break;
case "navList":
c = e(un + a[0]), r = c[At]("a"), s = [], r.each(function() {
var t = e(this),
n, r;
n = Math.max(0, t.parents("li")[z] - 1), r = t[Lt]("href"), s.push('<a class="link depth-' + n + '"' + (typeof r !== gt && r != "" ? ' href="' + r + '"' : "") + '><span class="indent-' + n + '"></span>' + t.text() + "</a>")
}), s[z] > 0 && n[jt]("<nav>" + s.join("") + "</nav>");
break;
case "copyText":
c = e(un + a[0]), n[jt](c.text());
break;
case "copyHTML":
c = e(un + a[0]), n[jt](c[jt]());
break;
case "moveElementContents":
c = e(un + a[0]), o[f] = function() {
c[M]().each(function() {
var t = e(this);
n[ht](t), t[Bt](_)
})
}, o[N] = function() {
n[M]().each(function() {
var n = e(this);
c[ht](n), n[Wt](_), t.refresh(n)
})
}, o[f]();
break;
case "moveElement":
c = e(un + a[0]), o[f] = function() {
e(V + c[Lt]("id") + '" />').insertBefore(c), n[ht](c), c[Bt](_)
}, o[N] = function() {
e(ut + c[Lt]("id")).replaceWith(c), c[Wt](_), t.refresh(c)
}, o[f]();
break;
case "moveCell":
c = e(un + a[0]), h = e(un + a[1]), o[f] = function() {
e(V + c[Lt]("id") + '" />').insertBefore(c), n[ht](c), c[S](E, Ft), h && h[Ct]()
}, o[N] = function() {
e(ut + c[Lt]("id")).replaceWith(c), c[S](E, ""), h && h[S](E, "")
}, o[f]();
break;
default:
}
},
parseResume: function(e) {
var t = e.get(0);
t[f] && t[f]()
},
parseSuspend: function(e) {
var t = e.get(0);
t[N] && t[N]()
},
recalc: function(e, n) {
var r = t._.parseMeasurement(e),
i;
switch (r[1]) {
case "%":
i = Math.floor(n * (r[0] / 100));
break;
case "em":
i = t.getBaseFontSize() * r[0];
break;
default:
case Qt:
i = r[0]
}
return i
},
recalcH: function(n) {
return t.recalc(n, e(window)[U]())
},
recalcW: function(n) {
return t.recalc(n, e(window)[E]())
},
refresh: function(r) {
var s;
t[n][F] && (r ? s = r.filter(q) : s = e(q), s[O]()[Vt](t[i][o]))
},
unlockView: function(e) {
e == sn && t[i][on][S](D, W), t[i][L].off(X), t[i][wt].off(mt), t._.vars.isMobile || t[i][wt].off(vt)
},
init: function() {
n in t[n] && (t._.extend(t[n], t[n][n]), delete t[n][n]), t._[_t](t[n], function(e) {
t[n][e] && typeof t[n][e] == $t && b in t[n][e] && (t[n][I][e] = t[n][e], delete t[n][e])
}), t[n][ln] && (t[n][F] = t[n][ln]());
if (t[n][F]) {
if (t._.vars[Mt] == "android" && t._.vars.deviceVersion < 4 || t._.vars[Mt] == "wp") t[n][F] = H;
t._.vars.IEVersion < 10 && (t[n][F] = H), t[n][Ut] && !t._.hasActive(t._[fn](t[n][Ut])) && (t[n][F] = H)
}
t[i][wt] = e(window), t.initTransforms(), t.initObjects(), t._[Pt](function() {
t.initLayers(), t.initIncludes(), t._.updateState(), t.refresh()
})
},
initIncludes: function() {
e(".skel-layers-include").each(function() {
t.parseInit(e(this))
})
},
initLayers: function() {
var r, s, o, u = 1;
t._[_t](t[n][I], function(r) {
var s;
if (!(b in t[n][I][r])) return;
if (!t[n][I][r][jt] && (s = e(un + r))[z] == 0) return;
o = new Nn(r, t[n][I][r], u++), t[i][I][r] = o, s && (s[M]()[Vt](o[j]), s.remove())
})
},
initObjects: function() {
t._[Pt](function() {
t[i][jt] = e(jt), t[i][Kt] = e(Kt), t[i][on] = e("html,body"), t[i][Kt].wrapInner('<div id="skel-layers-wrapper" />'), t[i][L] = e("#skel-layers-wrapper"), t[i][L][S](b, rn)[S](k, "0")[S](g, "0")[S](R, "0")[O](), t[i][P] = e('<div id="skel-layers-hiddenWrapper" />')[Vt](t[i][Kt]), t[i][P][S](U, "100%"), t[i][o] = e('<div id="skel-layers-visibleWrapper" />')[Vt](t[i][Kt]), t[i][o][S](b, rn), t._[pt](at, t[i][P][0]), t._[pt]("skel_layers_visibleWrapper", t[i][o][0]), t._[pt]("skel_layers_wrapper", t[i][L][0]), e("[autofocus]").focus()
})
},
initTransforms: function() {
if (t[n][F]) e.fn[r] = function() {
return e(this)[s](0, 0)
}, e.fn[s] = function(t, n) {
return e(this)[S](F, "translate(" + t + "px, " + n + "px)")
}, e.fn[O] = function() {
return e(this)[S]("backface-visibility", rt)[S]("perspective", "500")[qt]("transition", "transform " + t[n][dt] / 1e3 + "s ease-in-out")
};
else {
var o, u = [];
t[i][wt].resize(function() {
if (t[n][dt] != 0) {
var e = t[n][dt];
t[n][dt] = 0, window[v](function() {
t[n][dt] = e, u = []
}, e)
}
}), e.fn[r] = function() {
for (var r = 0; r < this[z]; r++) {
var s = this[r],
o = e(s);
u[s.id] && o.animate(u[s.id], t[n][dt], "swing", function() {
t._[_t](u[s.id], function(e) {
o[S](e, u[s.id][e])
}), t[i][Kt][S](D, W), t[i][L][S](E, Ft)[S](G, 0)
})
}
return e(this)
}, e.fn[s] = function(r, s) {
var o, f, l, c;
r = parseInt(r), s = parseInt(s), r != 0 ? (t[i][Kt][S](D, rt), t[i][L][S](E, t[i][wt][E]())) : l = function() {
t[i][Kt][S](D, W), t[i][L][S](E, Ft)
}, s < 0 ? t[i][L][S](G, Math.abs(s)) : c = function() {
t[i][L][S](G, 0)
};
for (o = 0; o < this[z]; o++) {
var h = this[o],
p = e(h),
d;
if (!u[h.id])
if (d = Nn[C][bt][p.data(st)]) {
u[h.id] = {};
switch (d.v) {
case T:
case R:
u[h.id][R] = parseInt(p[S](R));
break;
case y:
u[h.id][y] = parseInt(p[S](y))
}
switch (d.h) {
case T:
case k:
u[h.id][k] = parseInt(p[S](k));
break;
case g:
u[h.id][g] = parseInt(p[S](g))
}
} else d = p[b](), u[h.id] = {
top: d[R],
left: d[k]
};
a = {}, t._[_t](u[h.id], function(e) {
var n;
switch (e) {
case R:
n = t[Zt](u[h.id][e]) + s;
break;
case y:
n = t[Zt](u[h.id][e]) - s;
break;
case k:
n = t[Q](u[h.id][e]) + r;
break;
case g:
n = t[Q](u[h.id][e]) - r
}
a[e] = n
}), p.animate(a, t[n][dt], "swing", function() {
l && l(), c && c()
})
}
return e(this)
}, e.fn[O] = function() {
return e(this)[S](b, "absolute")
}
}
}
}, t)
}(jQuery))
});

You could use the vh unit for setting the height of an element.
#cta {
height: 100vh;
}
Do check the browser support though: http://caniuse.com/#feat=viewport-units

Use absolute positioning
#cta {
position: absolute;
bottom: 0;
height: 100%;
width: 400px; /* Adjust as needed */
left: 100px; /* To get it centered */
background-color: blue;
}
See working demo here

Plugin not working with current jQuery, TypeError in console

Using http://jsfiddle.net/heygrady/j5tHC/light/ as my example, trying to update to current jQuery, in my case 1.11.0
Works with jQuery 1.6.2, when I update to current version it throws an error in the console, "TypeError: f is undefined" I can't figure out why it makes a difference or track the variable, seems like it has the same values in both.
The following code runs the animation:
tween($.curve.bezier, {
x: 0,
y: $canvas[0].height,
points: [
[0, $canvas[0].height / 2],
[$canvas[0].width * 0.5, 0],
[$canvas[0].width * 0.9, $canvas[0].height],
[$canvas[0].width, $canvas[0].height/ 2]
]
});
I believe this is the function that is breaking inside the plugin:
(function (f, g, j, b) {
var h = /progid:DXImageTransform\.Microsoft\.Matrix\(.*?\)/,
c = /^([\+\-]=)?([\d+.\-]+)(.*)$/,
q = /%/;
var d = j.createElement('modernizr'),
e = d.style;
function n(s) {
return parseFloat(s)
}
function l() {
var s = {
transformProperty: '',
MozTransform: '-moz-',
WebkitTransform: '-webkit-',
OTransform: '-o-',
msTransform: '-ms-'
};
for (var t in s) {
if (typeof e[t] != 'undefined') {
return s[t]
}
}
return null
}
function r() {
if (typeof (g.Modernizr) !== 'undefined') {
return Modernizr.csstransforms
}
var t = [
'transformProperty',
'WebkitTransform',
'MozTransform',
'OTransform',
'msTransform'
];
for (var s in t) {
if (e[t[s]] !== b) {
return true
}
}
}
var a = l(),
i = a !== null ? a + 'transform' : false,
k = a !== null ? a + 'transform-origin' : false;
f.support.csstransforms = r();
if (a == '-ms-') {
i = 'msTransform';
k = 'msTransformOrigin'
}
f.extend({
transform: function (s) {
s.transform = this;
this.$elem = f(s);
this.applyingMatrix = false;
this.matrix = null;
this.height = null;
this.width = null;
this.outerHeight = null;
this.outerWidth = null;
this.boxSizingValue = null;
this.boxSizingProperty = null;
this.attr = null;
this.transformProperty = i;
this.transformOriginProperty = k
}
});
f.extend(f.transform, {
funcs: [
'matrix',
'origin',
'reflect',
'reflectX',
'reflectXY',
'reflectY',
'rotate',
'scale',
'scaleX',
'scaleY',
'skew',
'skewX',
'skewY',
'translate',
'translateX',
'translateY'
]
});
f.fn.transform = function (s, t) {
return this.each(function () {
var u = this.transform || new f.transform(this);
if (s) {
u.exec(s, t)
}
})
};
f.transform.prototype = {
exec: function (s, t) {
t = f.extend(true, {
forceMatrix: false,
preserve: false
}, t);
this.attr = null;
if (t.preserve) {
s = f.extend(true, this.getAttrs(true, true), s)
} else {
s = f.extend(true, {
}, s)
}
this.setAttrs(s);
if (f.support.csstransforms && !t.forceMatrix) {
return this.execFuncs(s)
} else {
if (f.browser.msie || (f.support.csstransforms && t.forceMatrix)) {
return this.execMatrix(s)
}
}
return false
},
execFuncs: function (t) {
var s = [
];
for (var u in t) {
if (u == 'origin') {
this[u].apply(this, f.isArray(t[u]) ? t[u] : [
t[u]
])
} else {
if (f.inArray(u, f.transform.funcs) !== - 1) {
s.push(this.createTransformFunc(u, t[u]))
}
}
}
this.$elem.css(i, s.join(' '));
return true
},
execMatrix: function (z) {
var C,
x,
t;
var F = this.$elem[0],
B = this;
function A(N, M) {
if (q.test(N)) {
return parseFloat(N) / 100 * B['safeOuter' + (M ? 'Height' : 'Width')]()
}
return o(F, N)
}
var s = /translate[X|Y]?/,
u = [
];
for (var v in z) {
switch (f.type(z[v])) {
case 'array':
t = z[v];
break;
case 'string':
t = f.map(z[v].split(','), f.trim);
break;
default:
t = [
z[v]
]
}
if (f.matrix[v]) {
if (f.cssAngle[v]) {
t = f.map(t, f.angle.toDegree)
} else {
if (!f.cssNumber[v]) {
t = f.map(t, A)
} else {
t = f.map(t, n)
}
}
x = f.matrix[v].apply(this, t);
if (s.test(v)) {
u.push(x)
} else {
C = C ? C.x(x) : x
}
} else {
if (v == 'origin') {
this[v].apply(this, t)
}
}
}
C = C || f.matrix.identity();
f.each(u, function (M, N) {
C = C.x(N)
});
var K = parseFloat(C.e(1, 1) .toFixed(6)),
I = parseFloat(C.e(2, 1) .toFixed(6)),
H = parseFloat(C.e(1, 2) .toFixed(6)),
G = parseFloat(C.e(2, 2) .toFixed(6)),
L = C.rows === 3 ? parseFloat(C.e(1, 3) .toFixed(6)) : 0,
J = C.rows === 3 ? parseFloat(C.e(2, 3) .toFixed(6)) : 0;
if (f.support.csstransforms && a === '-moz-') {
this.$elem.css(i, 'matrix(' + K + ', ' + I + ', ' + H + ', ' + G + ', ' + L + 'px, ' + J + 'px)')
} else {
if (f.support.csstransforms) {
this.$elem.css(i, 'matrix(' + K + ', ' + I + ', ' + H + ', ' + G + ', ' + L + ', ' + J + ')')
} else {
if (f.browser.msie) {
var w = ', FilterType=\'nearest neighbor\'';
var D = this.$elem[0].style;
var E = 'progid:DXImageTransform.Microsoft.Matrix(M11=' + K + ', M12=' + H + ', M21=' + I + ', M22=' + G + ', sizingMethod=\'auto expand\'' + w + ')';
var y = D.filter || f.curCSS(this.$elem[0], 'filter') || '';
D.filter = h.test(y) ? y.replace(h, E) : y ? y + ' ' + E : E;
this.applyingMatrix = true;
this.matrix = C;
this.fixPosition(C, L, J);
this.applyingMatrix = false;
this.matrix = null
}
}
}
return true
},
origin: function (s, t) {
if (f.support.csstransforms) {
if (typeof t === 'undefined') {
this.$elem.css(k, s)
} else {
this.$elem.css(k, s + ' ' + t)
}
return true
}
switch (s) {
case 'left':
s = '0';
break;
case 'right':
s = '100%';
break;
case 'center':
case b:
s = '50%'
}
switch (t) {
case 'top':
t = '0';
break;
case 'bottom':
t = '100%';
break;
case 'center':
case b:
t = '50%'
}
this.setAttr('origin', [
q.test(s) ? s : o(this.$elem[0], s) + 'px',
q.test(t) ? t : o(this.$elem[0], t) + 'px'
]);
return true
},
createTransformFunc: function (t, u) {
if (t.substr(0, 7) === 'reflect') {
var s = u ? f.matrix[t]() : f.matrix.identity();
return 'matrix(' + s.e(1, 1) + ', ' + s.e(2, 1) + ', ' + s.e(1, 2) + ', ' + s.e(2, 2) + ', 0, 0)'
}
if (t == 'matrix') {
if (a === '-moz-') {
u[4] = u[4] ? u[4] + 'px' : 0;
u[5] = u[5] ? u[5] + 'px' : 0
}
}
return t + '(' + (f.isArray(u) ? u.join(', ') : u) + ')'
},
fixPosition: function (B, y, x, D, s) {
var w = new f.matrix.calc(B, this.safeOuterHeight(), this.safeOuterWidth()),
C = this.getAttr('origin');
var v = w.originOffset(new f.matrix.V2(q.test(C[0]) ? parseFloat(C[0]) / 100 * w.outerWidth : parseFloat(C[0]), q.test(C[1]) ? parseFloat(C[1]) / 100 * w.outerHeight : parseFloat(C[1])));
var t = w.sides();
var u = this.$elem.css('position');
if (u == 'static') {
u = 'relative'
}
var A = {
top: 0,
left: 0
};
var z = {
position: u,
top: (v.top + x + t.top + A.top) + 'px',
left: (v.left + y + t.left + A.left) + 'px',
zoom: 1
};
this.$elem.css(z)
}
};
function o(s, u) {
var t = c.exec(f.trim(u));
if (t[3] && t[3] !== 'px') {
var w = 'paddingBottom',
v = f.style(s, w);
f.style(s, w, u);
u = p(s, w);
f.style(s, w, v);
return u
}
return parseFloat(u)
}
function p(t, u) {
if (t[u] != null && (!t.style || t.style[u] == null)) {
return t[u]
}
var s = parseFloat(f.css(t, u));
return s && s > - 10000 ? s : 0
}
}) (jQuery, this, this.document);

jQuery Scroll not working. (Uncaught ReferenceError: jQuery is not defined )

I have installed a theme on opencart 1.5.6.4 and for some reason the scroll carousel doesn't work. I have included the file below. Can anyone see any errors? Or also look at the website on chrome web inspector.
The error on google chrome web inspector says
Uncaught ReferenceError: jQuery is not defined
But I am not very good with javascript so I don't know what the error could be.
http://ilovefancydress.com/
Link to js file
(function(t) {
"use strict";
var i = t.jCarousel = {};
i.version = "0.3.0-beta.5";
var s = /^([+\-]=)?(.+)$/;
i.parseTarget = function(t) {
var i = !1,
e = "object" != typeof t ? s.exec(t) : null;
return e ? (t = parseInt(e[2], 10) || 0, e[1] && (i = !0, "-=" ===
e[1] && (t *= -1))) : "object" != typeof t && (t =
parseInt(t, 10) || 0), {
target: t,
relative: i
}
}, i.detectCarousel = function(t) {
for (var i; t.size() > 0;) {
if (i = t.filter("[data-jcarousel]"), i.size() > 0) return i;
if (i = t.find("[data-jcarousel]"), i.size() > 0) return i;
t = t.parent()
}
return null
}, i.base = function(s) {
return {
version: i.version,
_options: {},
_element: null,
_carousel: null,
_init: t.noop,
_create: t.noop,
_destroy: t.noop,
_reload: t.noop,
create: function() {
return this._element.attr("data-" + s.toLowerCase(), !
0).data(s, this), !1 === this._trigger(
"create") ? this : (this._create(), this._trigger(
"createend"), this)
},
destroy: function() {
return !1 === this._trigger("destroy") ? this : (
this._destroy(), this._trigger("destroyend"),
this._element.removeData(s).removeAttr(
"data-" + s.toLowerCase()), this)
},
reload: function(t) {
return !1 === this._trigger("reload") ? this : (t &&
this.options(t), this._reload(), this._trigger(
"reloadend"), this)
},
element: function() {
return this._element
},
options: function(i, s) {
if (0 === arguments.length) return t.extend({},
this._options);
if ("string" == typeof i) {
if (s === void 0) return this._options[i] ===
void 0 ? null : this._options[i];
this._options[i] = s
} else this._options = t.extend({}, this._options,
i);
return this
},
carousel: function() {
return this._carousel || (this._carousel = i.detectCarousel(
this.options("carousel") || this._element
), this._carousel || t.error(
'Could not detect carousel for plugin "' +
s + '"')), this._carousel
},
_trigger: function(i, e, r) {
var n, o = !1;
return r = [this].concat(r || []), (e || this._element)
.each(function() {
n = t.Event((i + "." + s).toLowerCase()),
t(this).trigger(n, r), n.isDefaultPrevented() &&
(o = !0)
}), !o
}
}
}, i.plugin = function(s, e) {
var r = t[s] = function(i, s) {
this._element = t(i), this.options(s), this._init(),
this.create()
};
return r.fn = r.prototype = t.extend({}, i.base(s), e), t.fn[s] =
function(i) {
var e = Array.prototype.slice.call(arguments, 1),
n = this;
return "string" == typeof i ? this.each(function() {
var r = t(this).data(s);
if (!r) return t.error(
"Cannot call methods on " + s +
" prior to initialization; " +
'attempted to call method "' +
i + '"');
if (!t.isFunction(r[i]) || "_" === i.charAt(
0)) return t.error('No such method "' +
i + '" for ' + s + " instance");
var o = r[i].apply(r, e);
return o !== r && o !== void 0 ? (n = o, !1) :
void 0
}) : this.each(function() {
var e = t(this).data(s);
e instanceof r ? e.reload(i) : new r(this,
i)
}), n
}, r
}
})(jQuery),
function(t, i) {
"use strict";
var s = function(t) {
return parseFloat(t) || 0
};
t.jCarousel.plugin("jcarousel", {
animating: !1,
tail: 0,
inTail: !1,
resizeTimer: null,
lt: null,
vertical: !1,
rtl: !1,
circular: !1,
underflow: !1,
_options: {
list: function() {
return this.element().children().eq(0)
},
items: function() {
return this.list().children()
},
animation: 400,
transitions: !1,
wrap: null,
vertical: null,
rtl: null,
center: !1
},
_list: null,
_items: null,
_target: null,
_first: null,
_last: null,
_visible: null,
_fullyvisible: null,
_init: function() {
var t = this;
return this.onWindowResize = function() {
t.resizeTimer && clearTimeout(t.resizeTimer), t
.resizeTimer = setTimeout(function() {
t.reload()
}, 100)
}, this
},
_create: function() {
this._reload(), t(i).on("resize.jcarousel", this.onWindowResize)
},
_destroy: function() {
t(i).off("resize.jcarousel", this.onWindowResize)
},
_reload: function() {
this.vertical = this.options("vertical"), null == this.vertical &&
(this.vertical = this.list().height() > this.list()
.width()), this.rtl = this.options("rtl"), null ==
this.rtl && (this.rtl = function(i) {
if ("rtl" === ("" + i.attr("dir")).toLowerCase())
return !0;
var s = !1;
return i.parents("[dir]").each(function() {
return /rtl/i.test(t(this).attr(
"dir")) ? (s = !0, !1) :
void 0
}), s
}(this._element)), this.lt = this.vertical ? "top" :
"left", this._items = null;
var i = this._target && this.index(this._target) >= 0 ?
this._target : this.closest();
this.circular = "circular" === this.options("wrap"),
this.underflow = !1;
var s = {
left: 0,
top: 0
};
return i.size() > 0 && (this._prepare(i), this.list().find(
"[data-jcarousel-clone]").remove(), this._items =
null, this.underflow = this._fullyvisible.size() >=
this.items().size(), this.circular = this.circular &&
!this.underflow, s[this.lt] = this._position(i) +
"px"), this.move(s), this
},
list: function() {
if (null === this._list) {
var i = this.options("list");
this._list = t.isFunction(i) ? i.call(this) : this._element
.find(i)
}
return this._list
},
items: function() {
if (null === this._items) {
var i = this.options("items");
this._items = (t.isFunction(i) ? i.call(this) :
this.list().find(i)).not(
"[data-jcarousel-clone]")
}
return this._items
},
index: function(t) {
return this.items().index(t)
},
closest: function() {
var i, e = this,
r = this.list().position()[this.lt],
n = t(),
o = !1,
a = this.vertical ? "bottom" : this.rtl ? "left" :
"right";
return this.rtl && !this.vertical && (r = -1 * (r +
this.list().width() - this.clipping())), this.items()
.each(function() {
if (n = t(this), o) return !1;
var l = e.dimension(n);
if (r += l, r >= 0) {
if (i = l - s(n.css("margin-" + a)), !(
0 >= Math.abs(r) - l + i / 2))
return !1;
o = !0
}
}), n
},
target: function() {
return this._target
},
first: function() {
return this._first
},
last: function() {
return this._last
},
visible: function() {
return this._visible
},
fullyvisible: function() {
return this._fullyvisible
},
hasNext: function() {
if (!1 === this._trigger("hasnext")) return !0;
var t = this.options("wrap"),
i = this.items().size() - 1;
return i >= 0 && (t && "first" !== t || i > this.index(
this._last) || this.tail && !this.inTail) ? !0 :
!1
},
hasPrev: function() {
if (!1 === this._trigger("hasprev")) return !0;
var t = this.options("wrap");
return this.items().size() > 0 && (t && "last" !== t ||
this.index(this._first) > 0 || this.tail &&
this.inTail) ? !0 : !1
},
clipping: function() {
return this._element["inner" + (this.vertical ?
"Height" : "Width")]()
},
dimension: function(t) {
return t["outer" + (this.vertical ? "Height" : "Width")]
(!0)
},
scroll: function(i, e, r) {
if (this.animating) return this;
if (!1 === this._trigger("scroll", null, [i, e])) return
this;
t.isFunction(e) && (r = e, e = !0);
var n = t.jCarousel.parseTarget(i);
if (n.relative) {
var o, a, l, h, u, c, f, d, _ = this.items().size() -
1,
p = Math.abs(n.target),
m = this.options("wrap");
if (n.target > 0) {
var v = this.index(this._last);
if (v >= _ && this.tail) this.inTail ? "both" ===
m || "last" === m ? this._scroll(0, e, r) :
this._scroll(Math.min(this.index(this._target) +
p, _), e, r) : this._scrollTail(e, r);
else if (o = this.index(this._target), this.underflow &&
o === _ && ("circular" === m || "both" ===
m || "last" === m) || !this.underflow &&
v === _ && ("both" === m || "last" === m))
this._scroll(0, e, r);
else if (l = o + p, this.circular && l > _) {
for (d = _, u = this.items().get(-1); l > d++;)
u = this.items().eq(0), c = this._visible
.index(u) >= 0, c && u.after(u.clone(!0)
.attr("data-jcarousel-clone", !0)),
this.list().append(u), c || (f = {}, f[
this.lt] = this.dimension(u) *
(this.rtl ? -1 : 1), this.moveBy(f)
), this._items = null;
this._scroll(u, e, r)
} else this._scroll(Math.min(l, _), e, r)
} else if (this.inTail) this._scroll(Math.max(this.index(
this._first) - p + 1, 0), e, r);
else if (a = this.index(this._first), o = this.index(
this._target), h = this.underflow ? o : a,
l = h - p, 0 >= h && (this.underflow &&
"circular" === m || "both" === m || "first" ===
m)) this._scroll(_, e, r);
else if (this.circular && 0 > l) {
for (d = l, u = this.items().get(0); 0 > d++;) {
u = this.items().eq(-1), c = this._visible.index(
u) >= 0, c && u.after(u.clone(!0).attr(
"data-jcarousel-clone", !0)), this.list()
.prepend(u), this._items = null;
var g = s(this.list().position()[this.lt]),
y = this.dimension(u);
this.rtl && !this.vertical ? g += y : g -=
y, f = {}, f[this.lt] = g + "px", this.move(
f)
}
this._scroll(u, e, r)
} else this._scroll(Math.max(l, 0), e, r)
} else this._scroll(n.target, e, r);
return this._trigger("scrollend"), this
},
moveBy: function(t, i) {
var e = this.list().position();
return t.left && (t.left = e.left + s(t.left) + "px"),
t.top && (t.top = e.top + s(t.top) + "px"), this.move(
t, i)
},
move: function(i, s) {
s = s || {};
var e = this.options("transitions"),
r = !!e,
n = !!e.transforms,
o = !!e.transforms3d,
a = s.duration || 0,
l = this.list();
if (!r && a > 0) return l.animate(i, s), void 0;
var h = s.complete || t.noop,
u = {};
if (r) {
var c = l.css(["transitionDuration",
"transitionTimingFunction",
"transitionProperty"
]),
f = h;
h = function() {
t(this).css(c), f.call(this)
}, u = {
transitionDuration: (a > 0 ? a / 1e3 : 0) +
"s",
transitionTimingFunction: e.easing || s.easing,
transitionProperty: a > 0 ? function() {
return n || o ? "all" : i.left ?
"left" : "top"
}() : "none",
transform: "none"
}
}
o ? u.transform = "translate3d(" + (i.left || 0) + "," +
(i.top || 0) + ",0)" : n ? u.transform =
"translate(" + (i.left || 0) + "," + (i.top || 0) +
")" : t.extend(u, i), r && a > 0 && l.one(
"transitionend webkitTransitionEnd oTransitionEnd otransitionend MSTransitionEnd",
h), l.css(u), 0 >= a && l.each(function() {
h.call(this)
})
},
_scroll: function(i, e, r) {
if (this.animating) return t.isFunction(r) && r.call(
this, !1), this;
if ("object" != typeof i ? i = this.items().eq(i) : i.jquery ===
void 0 && (i = t(i)), 0 === i.size()) return t.isFunction(
r) && r.call(this, !1), this;
this.inTail = !1, this._prepare(i);
var n = this._position(i),
o = s(this.list().position()[this.lt]);
if (n === o) return t.isFunction(r) && r.call(this, !1),
this;
var a = {};
return a[this.lt] = n + "px", this._animate(a, e, r),
this
},
_scrollTail: function(i, s) {
if (this.animating || !this.tail) return t.isFunction(s) &&
s.call(this, !1), this;
var e = this.list().position()[this.lt];
this.rtl ? e += this.tail : e -= this.tail, this.inTail = !
0;
var r = {};
return r[this.lt] = e + "px", this._update({
target: this._target.next(),
fullyvisible: this._fullyvisible.slice(1).add(
this._visible.last())
}), this._animate(r, i, s), this
},
_animate: function(i, s, e) {
if (e = e || t.noop, !1 === this._trigger("animate"))
return e.call(this, !1), this;
this.animating = !0;
var r = this.options("animation"),
n = t.proxy(function() {
this.animating = !1;
var t = this.list().find(
"[data-jcarousel-clone]");
t.size() > 0 && (t.remove(), this._reload()),
this._trigger("animateend"), e.call(
this, !0)
}, this),
o = "object" == typeof r ? t.extend({}, r) : {
duration: r
},
a = o.complete || t.noop;
return s === !1 ? o.duration = 0 : t.fx.speeds[o.duration] !==
void 0 && (o.duration = t.fx.speeds[o.duration]), o
.complete = function() {
n(), a.call(this)
}, this.move(i, o), this
},
_prepare: function(i) {
var e, r, n, o = this.index(i),
a = o,
l = this.dimension(i),
h = this.clipping(),
u = this.vertical ? "bottom" : this.rtl ? "left" :
"right",
c = this.options("center"),
f = {
target: i,
first: i,
last: i,
visible: i,
fullyvisible: h >= l ? i : t()
};
if (c && (l /= 2, h /= 2), h > l)
for (;;) {
if (e = this.items().eq(++a), 0 === e.size()) {
if (!this.circular) break;
if (e = this.items().eq(0), r = this._visible
.index(e) >= 0, i.get(0) === e.get(0))
break;
if (r && e.after(e.clone(!0).attr(
"data-jcarousel-clone", !0)), this.list()
.append(e), !r) {
var d = {};
d[this.lt] = this.dimension(e) * (this.rtl ?
-1 : 1), this.moveBy(d)
}
this._items = null
}
if (l += this.dimension(e), f.last = e, f.visible =
f.visible.add(e), n = s(e.css("margin-" + u)),
h >= l - n && (f.fullyvisible = f.fullyvisible
.add(e)), l >= h) break
}
if (!this.circular && !c && h > l)
for (a = o;;) {
if (0 > --a) break;
if (e = this.items().eq(a), 0 === e.size())
break;
if (l += this.dimension(e), f.first = e, f.visible =
f.visible.add(e), n = s(e.css("margin-" + u)),
h >= l - n && (f.fullyvisible = f.fullyvisible
.add(e)), l >= h) break
}
return this._update(f), this.tail = 0, c || "circular" ===
this.options("wrap") || "custom" === this.options(
"wrap") || this.index(f.last) !== this.items().size() -
1 || (l -= s(f.last.css("margin-" + u)), l > h && (
this.tail = l - h)), this
},
_position: function(t) {
var i = this._first,
s = i.position()[this.lt],
e = this.options("center"),
r = e ? this.clipping() / 2 - this.dimension(i) / 2 :
0;
return this.rtl && !this.vertical ? (s -= this.clipping() -
this.dimension(i), s += r) : s -= r, !e && (
this.index(t) > this.index(i) || this.inTail) &&
this.tail ? (s = this.rtl ? s - this.tail : s +
this.tail, this.inTail = !0) : this.inTail = !1, -
s
},
_update: function(i) {
var s, e = this,
r = {
target: this._target || t(),
first: this._first || t(),
last: this._last || t(),
visible: this._visible || t(),
fullyvisible: this._fullyvisible || t()
},
n = this.index(i.first || r.first) < this.index(r.first),
o = function(s) {
var o = [],
a = [];
i[s].each(function() {
0 > r[s].index(this) && o.push(this)
}), r[s].each(function() {
0 > i[s].index(this) && a.push(this)
}), n ? o = o.reverse() : a = a.reverse(),
e._trigger("item" + s + "in", t(o)), e._trigger(
"item" + s + "out", t(a)), e["_" + s] =
i[s]
};
for (s in i) o(s);
return this
}
})
}
Hope you can help.
I have updated my include scripts but it is still not working.
<script type="text/javascript" src="catalog/view/javascript/jquery/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="catalog/view/javascript/jquery/ui/jquery-ui-1.8.16.custom.min.js"></script>
<script type="text/javascript" src="catalog/view/javascript/add2cart-go2cart/common.js"></script>
<script type="text/javascript" src="catalog/view/theme/madame/js/common.js"></script>
<script type="text/javascript" src="catalog/view/theme/madame/js/jquery.flexslider.js"></script>
<script type="text/javascript" src="catalog/view/theme/madame/js/fancybox/jquery.fancybox-1.3.4.pack.js"></script>
<script type="text/javascript" src="catalog/view/theme/madame/js/fancybox/fancybox.setting.js"></script>
<script type="text/javascript" src="catalog/view/theme/madame/js/jquery.accordion.source.js"></script>
<script type="text/javascript" src="catalog/view/theme/madame/js/jquery.tweet.js"></script>
<script type="text/javascript" src="catalog/view/theme/madame/js/bootstrap/bootstrap-tooltip.js"></script>
<script type="text/javascript" src="instafeed.min.js"></script>
<script type="text/javascript" src="catalog/view/theme/madame/js/jquery.jcarousel.min.js"></script>
<script type="text/javascript" src="catalog/view/javascript/jquery/nivo-slider/jquery.nivo.slider.pack.js"></script>
This is the error I am getting in console:
Uncaught TypeError: Failed to execute 'animate' on 'Element': 1 argument required, but only 0 present. ilovefancydress.com/catalog/view/javascript/jquery/jquery-1.7.1.min.js:3

Looking at your target page it appears you are loading your carousel before you have loaded your jquery:
<script type="text/javascript" src="catalog/view/theme/madame/js/jquery.jcarousel.min.js"></script>
<script type="text/javascript" src="catalog/view/javascript/jquery/jquery-1.7.1.min.js"></script>
If you are loading any jQuery-dependant plugins they have to be loaded after the jQuery itself is loaded. Sometimes jQuery plugins depend also on jQuery UI, therefore they need to be loaded after this one as well. In Your case the correct solution should be:
<script type="text/javascript" src="catalog/view/javascript/jquery/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="catalog/view/javascript/jquery/ui/jquery-ui-1.8.16.custom.min.js"></script>
<script type="text/javascript" src="catalog/view/theme/madame/js/jquery.jcarousel.min.js"></script>
Make sure there are no other dependencies and if they are make sure to fullfill them.