Sly slider with scrollbar

<script src=”https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js”></script>
<script src=”https://cdnjs.cloudflare.com/ajax/libs/Sly/1.6.1/sly.min.js”></script>

<div class=”wrap”>
<h2>Cycling by items
<small>- 1 second interval, enabled pause on hover</small>
</h2>

<div class=”frame main-news__items-wrapp” id=”cycleitems” style=”overflow: hidden;”>
<ul class=”clearfix main-news__items-wrapp”>
<li class=”news-slider__item”>
<a href=”./” class=”news-slider__link”></a>
<div class=”news-slider__media” style=”background-image: url(‘https://i.pinimg.com/564x/74/81/31/7481313dd204b64831dcf8193e226c8f.jpg’)”>
</div>
<div class=”news-slider__text-wrap”>
<div class=”news-slider__title”>
<h4 class=”news-slider__head subhead3″>Олег Майборода</h4>
<div class=”date position”>
<span>Director</span>
</div>
</div>
<p class=”news-slider__text text”>
Альта Гузман всегда мечтала быть строителем. Она воплотила свою мечту, пройдя путь от мастера до генерального директора в
системе комбината «Луганскшахтострой».
</p>
</div>
</li>
<li class=”news-slider__item”>
<a href=”./” class=”news-slider__link”></a>
<div class=”news-slider__media” style=”background-image: url(‘https://i.pinimg.com/564x/ea/41/d2/ea41d292d626768ec6d6f7cfb4b9f825.jpg’)”>
</div>
<div class=”news-slider__text-wrap”>
<div class=”news-slider__title”>
<h4 class=”news-slider__head subhead3″>Алла Гузман</h4>
<div class=”date position”>
<span>CEO</span>
</div>
</div>
<p class=”news-slider__text text”>
Альта Гузман всегда мечтала быть строителем. Она воплотила свою мечту, пройдя путь от мастера до генерального директора в
системе комбината «Луганскшахтострой».
</p>
</div>
</li>
<li class=”news-slider__item”>
<a href=”./” class=”news-slider__link”></a>
<div class=”news-slider__media” style=”background-image: url(‘https://i.pinimg.com/564x/ce/ea/0a/ceea0a1403ab9baa36bc0cc250ca84e4.jpg’)”>
</div>
<div class=”news-slider__text-wrap”>
<div class=”news-slider__title”>
<h4 class=”news-slider__head subhead3″>Алла Гузман</h4>
<div class=”date position”>
<span>CEO</span>
</div>
</div>
<p class=”news-slider__text text”>
Альта Гузман всегда мечтала быть строителем. Она воплотила свою мечту, пройдя путь от мастера до генерального директора в
системе комбината «Луганскшахтострой».
</p>
</div>
</li>
<li class=”news-slider__item”>
<a href=”./” class=”news-slider__link”></a>
<div class=”news-slider__media” style=”background-image: url(‘https://i.pinimg.com/564x/74/d8/7e/74d87e841b3d67d9b052c6b560da0ef3.jpg’)”>
</div>
<div class=”news-slider__text-wrap”>
<div class=”news-slider__title”>
<h4 class=”news-slider__head subhead3″>Якуб Василевский</h4>
<div class=”date position”>
<span>ART Director</span>
</div>
</div>
<p class=”news-slider__text text”>
Альта Гузман всегда мечтала быть строителем. Она воплотила свою мечту, пройдя путь от мастера до генерального директора в
системе комбината «Луганскшахтострой».
</p>
</div>
</li>
<li class=”news-slider__item”>
<a href=”./” class=”news-slider__link”></a>
<div class=”news-slider__media” style=”background-image: url(‘https://i.pinimg.com/564x/74/81/31/7481313dd204b64831dcf8193e226c8f.jpg’)”>
</div>
<div class=”news-slider__text-wrap”>
<div class=”news-slider__title”>
<h4 class=”news-slider__head subhead3″>Алла Гузман</h4>
<div class=”date position”>
<span>CEO</span>
</div>
</div>
<p class=”news-slider__text text”>
Альта Гузман всегда мечтала быть строителем. Она воплотила свою мечту, пройдя путь от мастера до генерального директора в
системе комбината «Луганскшахтострой».
</p>
</div>
</li>
<li class=”news-slider__item”>
<a href=”./” class=”news-slider__link”></a>
<div class=”news-slider__media” style=”background-image: url(‘https://i.pinimg.com/564x/f5/6c/9e/f56c9eea148c88bd371128f7ea8c943f.jpg’)”>
</div>
<div class=”news-slider__text-wrap”>
<div class=”news-slider__title”>
<h4 class=”news-slider__head subhead3″>Алла Гузман</h4>
<div class=”date position”>
<span>CEO</span>
</div>
</div>
<p class=”news-slider__text text”>
Альта Гузман всегда мечтала быть строителем. Она воплотила свою мечту, пройдя путь от мастера до генерального директора в
системе комбината «Луганскшахтострой».
</p>
</div>
</li>
<li class=”news-slider__item”>
<a href=”./” class=”news-slider__link”></a>
<div class=”news-slider__media” style=”background-image: url(‘https://i.pinimg.com/564x/ac/36/92/ac36928537533ced14a7bfd662ee6b0d.jpg’)”>
</div>
<div class=”news-slider__text-wrap”>
<div class=”news-slider__title”>
<h4 class=”news-slider__head subhead3″>Алла Гузман</h4>
<div class=”date position”>
<span>CEO</span>
</div>
</div>
<p class=”news-slider__text text”>
Альта Гузман всегда мечтала быть строителем. Она воплотила свою мечту, пройдя путь от мастера до генерального директора в
системе комбината «Луганскшахтострой».
</p>
</div>
</li>
<li class=”news-slider__item”>
<a href=”./” class=”news-slider__link”></a>
<div class=”news-slider__media” style=”background-image: url(‘https://i.pinimg.com/564x/a1/11/56/a111564cd4669dba69b0dca2c58ae0ab.jpg’)”>
</div>
<div class=”news-slider__text-wrap”>
<div class=”news-slider__title”>
<h4 class=”news-slider__head subhead3″>Алла Гузман</h4>
<div class=”date position”>
<span>CEO</span>
</div>
</div>
<p class=”news-slider__text text”>
Альта Гузман всегда мечтала быть строителем. Она воплотила свою мечту, пройдя путь от мастера до генерального директора в
системе комбината «Луганскшахтострой».
</p>
</div>
</li>
<li class=”news-slider__item”>
<a href=”./” class=”news-slider__link”></a>
<div class=”news-slider__media” style=”background-image: url(‘https://i.pinimg.com/564x/a2/f7/4e/a2f74e0bb75a3e2693c9bad3daad83e1.jpg’)”>
</div>
<div class=”news-slider__text-wrap”>
<div class=”news-slider__title”>
<h4 class=”news-slider__head subhead3″>Алла Гузман</h4>
<div class=”date position”>
<span>CEO</span>
</div>
</div>
<p class=”news-slider__text text”>
Альта Гузман всегда мечтала быть строителем. Она воплотила свою мечту, пройдя путь от мастера до генерального директора в
системе комбината «Луганскшахтострой».
</p>
</div>
</li>
<li class=”news-slider__item”>
<a href=”./” class=”news-slider__link”></a>
<div class=”news-slider__media” style=”background-image: url(‘https://i.pinimg.com/564x/f5/6c/9e/f56c9eea148c88bd371128f7ea8c943f.jpg’)”>
</div>
<div class=”news-slider__text-wrap”>
<div class=”news-slider__title”>
<h4 class=”news-slider__head subhead3″>Алла Гузман</h4>
<div class=”date position”>
<span>CEO</span>
</div>
</div>
<p class=”news-slider__text text”>
Альта Гузман всегда мечтала быть строителем. Она воплотила свою мечту, пройдя путь от мастера до генерального директора в
системе комбината «Луганскшахтострой».
</p>
</div>
</li>
<li class=”news-slider__item”>
<a href=”./” class=”news-slider__link”></a>
<div class=”news-slider__media” style=”background-image: url(‘https://i.pinimg.com/564x/fc/1d/e3/fc1de3b00ca12039664c356ff0a4dfd2.jpg’)”>
</div>
<div class=”news-slider__text-wrap”>
<div class=”news-slider__title”>
<h4 class=”news-slider__head subhead3″>Алла Гузман</h4>
<div class=”date position”>
<span>CEO</span>
</div>
</div>
<p class=”news-slider__text text”>
Альта Гузман всегда мечтала быть строителем. Она воплотила свою мечту, пройдя путь от мастера до генерального директора в
системе комбината «Луганскшахтострой».
</p>
</div>
</li>
<li class=”news-slider__item”>
<a href=”./” class=”news-slider__link”></a>
<div class=”news-slider__media” style=”background-image: url(‘https://i.pinimg.com/564x/62/37/7c/62377c9a86fe1e2e6294d35388d71b05.jpg’)”>
</div>
<div class=”news-slider__text-wrap”>
<div class=”news-slider__title”>
<h4 class=”news-slider__head subhead3″>Алла Гузман</h4>
<div class=”date position”>
<span>CEO</span>
</div>
</div>
<p class=”news-slider__text text”>
Альта Гузман всегда мечтала быть строителем. Она воплотила свою мечту, пройдя путь от мастера до генерального директора в
системе комбината «Луганскшахтострой».
</p>
</div>
</li>
<li class=”news-slider__item”>
<a href=”./” class=”news-slider__link”></a>
<div class=”news-slider__media” style=”background-image: url(‘https://i.pinimg.com/564x/c6/36/d5/c636d5d623426a59a2cf973e1e99c345.jpg’)”>
</div>
<div class=”news-slider__text-wrap”>
<div class=”news-slider__title”>
<h4 class=”news-slider__head subhead3″>Алла Гузман</h4>
<div class=”date position”>
<span>CEO</span>
</div>
</div>
<p class=”news-slider__text text”>
Альта Гузман всегда мечтала быть строителем. Она воплотила свою мечту, пройдя путь от мастера до генерального директора в
системе комбината «Луганскшахтострой».
</p>
</div>
</li>
<li class=”news-slider__item”>
<a href=”./” class=”news-slider__link”></a>
<div class=”news-slider__media” style=”background-image: url(‘https://i.pinimg.com/564x/ea/41/d2/ea41d292d626768ec6d6f7cfb4b9f825.jpg’)”>
</div>
<div class=”news-slider__text-wrap”>
<div class=”news-slider__title”>
<h4 class=”news-slider__head subhead3″>Алла Гузман</h4>
<div class=”date position”>
<span>CEO</span>
</div>
</div>
<p class=”news-slider__text text”>
Альта Гузман всегда мечтала быть строителем. Она воплотила свою мечту, пройдя путь от мастера до генерального директора в
системе комбината «Луганскшахтострой».
</p>
</div>
</li>
<li class=”news-slider__item”>
<a href=”./” class=”news-slider__link”></a>
<div class=”news-slider__media” style=”background-image: url(‘https://i.pinimg.com/564x/ce/ea/0a/ceea0a1403ab9baa36bc0cc250ca84e4.jpg’)”>
</div>
<div class=”news-slider__text-wrap”>
<div class=”news-slider__title”>
<h4 class=”news-slider__head subhead3″>Алла Гузман</h4>
<div class=”date position”>
<span>CEO</span>
</div>
</div>
<p class=”news-slider__text text”>
Альта Гузман всегда мечтала быть строителем. Она воплотила свою мечту, пройдя путь от мастера до генерального директора в
системе комбината «Луганскшахтострой».
</p>
</div>
</li>
<li class=”news-slider__item”>
<a href=”./” class=”news-slider__link”></a>
<div class=”news-slider__media” style=”background-image: url(‘https://instagram.fiev12-1.fna.fbcdn.net/vp/a12049e582d5b2b849f3c62491ad6e9c/5B27C992/t51.2885-15/e15/11235989_1441858936110148_1720813047_n.jpg’)”>
</div>
<div class=”news-slider__text-wrap”>
<div class=”news-slider__title”>
<h4 class=”news-slider__head subhead3″>Алла Гузман</h4>
<div class=”date position”>
<span>CEO</span>
</div>
</div>
<p class=”news-slider__text text”>
Альта Гузман всегда мечтала быть строителем. Она воплотила свою мечту, пройдя путь от мастера до генерального директора в
системе комбината «Луганскшахтострой».
</p>
</div>
</li>
</ul>
</div>

<div class=”scrollbar”>
<div class=”handle”>
<div class=”mousearea”></div>
</div>
</div>

<div class=”controls center”>
<button class=”btn prev”>
<i class=”icon-chevron-left”></i> prev</button>

<div class=”btn-group”>
<button class=”btn pause”>
<i class=”icon-pause”></i> pause</button>
<button class=”btn resume”>
<i class=”icon-play”></i> resume</button>
<button class=”btn toggle”>
<i class=”icon-pause”></i> toggle</button>
</div>

<button class=”btn next”>next
<i class=”icon-chevron-right”></i>
</button>
</div>
</div>

<style>
/* Frame */
.frame {
height: 440px;
line-height: 250px;
overflow: hidden;
}
.frame ul.main-news__items-wrapp {
list-style: none;
margin: 0;
padding: 0;
height: 100%;
position: relative;
}
.frame ul.main-news__items-wrapp li {
float: left;
width: 403px;
min-width: 403px;
height: 100%;
margin: 0 20px;
cursor: pointer;
}
.frame ul.main-news__items-wrapp li.active {
box-shadow: 0 4px 20px 0 rgba(88, 121, 163, 0.2);
}

/* Scrollbar */
.scrollbar {
margin: 1em 0 1em 0;
height: 3px;
background: #CDDDFB;
line-height: 0;
}
.scrollbar .handle {
width: 100px;
height: 100%;
background: #377CFD;
cursor: pointer;
}
.scrollbar .handle .mousearea {
position: absolute;
top: -9px;
left: 0;
width: 100%;
height: 20px;
}

/* Pages */
/* Controls */
.controls {
margin: 25px 0;
text-align: center;
}

.news-slider__item {
position: relative;
background: #FFFFFF;
transition: all 0.3s;
width: 403px;
height: 440px;
margin-right: 40px;
}
@media only screen and (max-width: 1200px) {
.news-slider__item {
width: 314px;
}
}
.news-slider__item:last-child {
margin-right: 0;
}
.news-slider__item:hover .news-slider__head {
color: #377CFD;
}
.news-slider__item:hover {
cursor: pointer;
box-shadow: 0 4px 20px 0 rgba(88, 121, 163, 0.2);
}
.news-slider__item .news-slider__link {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
height: 100%;
width: 100%;
display: block;
}
.news-slider__item .news-slider__media {
background-size: cover;
width: 100%;
height: 240px;
position: relative;
transition: all 0.5s;
}
.news-slider__item .news-slider__text-wrap {
padding: 30px 40px;
}
@media only screen and (max-width: 1024px) {
.news-slider__item .news-slider__text-wrap {
padding: 26px 20px;
}
}
.news-slider__item .news-slider__text-wrap .news-slider__title {
display: flex;
flex-flow: row nowrap;
justify-content: space-between;
align-items: flex-start;
}
.news-slider__item .news-slider__text-wrap .news-slider__title .news-slider__head {
margin: 0;
transition: all 0.3s;
width: 70%;
font-size: 18px;
}
@media only screen and (max-width: 1024px) {
.news-slider__item .news-slider__text-wrap .news-slider__title .news-slider__head {
font-size: 16px;
padding: 0 10px 0 0;
}
}
.news-slider__item .news-slider__text-wrap .news-slider__title .date {
opacity: 0.3;
color: #1D1D1D;
font-size: 13px;
line-height: 15px;
font-weight: 500;
width: 30%;
margin-top: 7px;
text-align: right;
white-space: nowrap;
}
.news-slider__item .news-slider__text-wrap .news-slider__title .date span:nth-child(2) {
margin: 0 3px;
}
@media only screen and (max-width: 1024px) {
.news-slider__item .news-slider__text-wrap .news-slider__text {
display: none;
}
}

.news-slider__item–youtube:hover {
box-shadow: none;
}
.news-slider__item–youtube:hover .news-slider__head {
color: #000;
}
.news-slider__item–youtube .news-slider__youtube-link {
background-size: cover;
position: relative;
transition: all 0.5s;
font-size: 0;
color: transparent;
height: 240px;
width: 100%;
display: block;
z-index: 9;
}
.news-slider__item–youtube .news-slider__youtube-link:before {
content: “”;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.4);
transition: all 0.5s;
}
.news-slider__item–youtube .news-slider__youtube-link:hover:before {
background-color: transparent;
transition: all 0.5s;
}
.news-slider__item–youtube .news-slider__text-wrap–youtube {
display: block;
text-decoration: none;
}
.news-slider__item–youtube .news-slider__text-wrap–youtube:hover .news-slider__head {
color: #377CFD;
}
.news-slider__item–youtube .news-slider__youtube-button {
position: absolute;
width: 0;
height: 0;
border: none;
border-top: 10px solid transparent;
border-bottom: 10px solid transparent;
border-left: 18px solid #fff;
background-color: transparent;
top: 30%;
left: 50%;
transform: translateX(-8px) translateY(-10px);
margin: 0;
padding: 0;
cursor: pointer;
transition: all 0.3s;
outline: none;
z-index: 10;
}
.news-slider__item–youtube .news-slider__youtube-button:hover {
border-left: 18px solid #2B62FC;
}
</style>

<script>
// ===== plugins.js
// Avoid `console` errors in browsers that lack a console.
(function () {
for (
var a,
e = function () {},
b = “assert clear count debug dir dirxml error exception group groupCollapsed groupEnd info log markTimeline profile profileEnd table time timeEnd timeStamp trace warn”.split(
” ”
),
c = b.length,
d = (window.console = window.console || {});
c–;

)
(a = b[c]), d[a] || (d[a] = e);
})();

// LoremImages
(function (b) {
b.fn.loremImages = function (e, d, j) {
var a = b.extend({}, b.fn.loremImages.defaults, j);
return this.each(function (c, k) {
var f = b(k),
g = “”;
for (c = 0; c < a.count; c++) {
var h = e + Math.round(Math.random() * a.randomWidth),
i = d + Math.round(Math.random() * a.randomHeight);
g += a.itemBuilder.call(
f,
c,
“//lorempixel.com/” +
(a.grey ? “g/” : “”) +
h +
“/” +
i +
“/” +
(a.category ? a.category + “/” : “”) +
“?” +
Math.round(Math.random() * 1e3),
h,
i
);
}
f.append(g);
});
};
b.fn.loremImages.defaults = {
count: 10,
grey: 0,
randomWidth: 0,
randomHeight: 0,
category: 0,
itemBuilder: function (e, d) {
return ‘<img src=”‘ + d + ‘” alt=”Lorempixel”>’;
}
};
})(jQuery);

// jQuery easing 1.3
jQuery.easing.jswing = jQuery.easing.swing;
jQuery.extend(jQuery.easing, {
def: “easeOutQuad”,
swing: function (e, a, c, b, d) {
return jQuery.easing[jQuery.easing.def](e, a, c, b, d);
},
easeInQuad: function (e, a, c, b, d) {
return b * (a /= d) * a + c;
},
easeOutQuad: function (e, a, c, b, d) {
return -b * (a /= d) * (a – 2) + c;
},
easeInOutQuad: function (e, a, c, b, d) {
return 1 > (a /= d / 2)
? (b / 2) * a * a + c
: (-b / 2) * (–a * (a – 2) – 1) + c;
},
easeInCubic: function (e, a, c, b, d) {
return b * (a /= d) * a * a + c;
},
easeOutCubic: function (e, a, c, b, d) {
return b * ((a = a / d – 1) * a * a + 1) + c;
},
easeInOutCubic: function (e, a, c, b, d) {
return 1 > (a /= d / 2)
? (b / 2) * a * a * a + c
: (b / 2) * ((a -= 2) * a * a + 2) + c;
},
easeInQuart: function (e, a, c, b, d) {
return b * (a /= d) * a * a * a + c;
},
easeOutQuart: function (e, a, c, b, d) {
return -b * ((a = a / d – 1) * a * a * a – 1) + c;
},
easeInOutQuart: function (e, a, c, b, d) {
return 1 > (a /= d / 2)
? (b / 2) * a * a * a * a + c
: (-b / 2) * ((a -= 2) * a * a * a – 2) + c;
},
easeInQuint: function (e, a, c, b, d) {
return b * (a /= d) * a * a * a * a + c;
},
easeOutQuint: function (e, a, c, b, d) {
return b * ((a = a / d – 1) * a * a * a * a + 1) + c;
},
easeInOutQuint: function (e, a, c, b, d) {
return 1 > (a /= d / 2)
? (b / 2) * a * a * a * a * a + c
: (b / 2) * ((a -= 2) * a * a * a * a + 2) + c;
},
easeInSine: function (e, a, c, b, d) {
return -b * Math.cos((a / d) * (Math.PI / 2)) + b + c;
},
easeOutSine: function (e, a, c, b, d) {
return b * Math.sin((a / d) * (Math.PI / 2)) + c;
},
easeInOutSine: function (e, a, c, b, d) {
return (-b / 2) * (Math.cos((Math.PI * a) / d) – 1) + c;
},
easeInExpo: function (e, a, c, b, d) {
return 0 == a ? c : b * Math.pow(2, 10 * (a / d – 1)) + c;
},
easeOutExpo: function (e, a, c, b, d) {
return a == d ? c + b : b * (-Math.pow(2, (-10 * a) / d) + 1) + c;
},
easeInOutExpo: function (e, a, c, b, d) {
return 0 == a
? c
: a == d
? c + b
: 1 > (a /= d / 2)
? (b / 2) * Math.pow(2, 10 * (a – 1)) + c
: (b / 2) * (-Math.pow(2, -10 * –a) + 2) + c;
},
easeInCirc: function (e, a, c, b, d) {
return -b * (Math.sqrt(1 – (a /= d) * a) – 1) + c;
},
easeOutCirc: function (e, a, c, b, d) {
return b * Math.sqrt(1 – (a = a / d – 1) * a) + c;
},
easeInOutCirc: function (e, a, c, b, d) {
return 1 > (a /= d / 2)
? (-b / 2) * (Math.sqrt(1 – a * a) – 1) + c
: (b / 2) * (Math.sqrt(1 – (a -= 2) * a) + 1) + c;
},
easeInElastic: function (e, a, c, b, d) {
var e = 1.70158,
f = 0,
g = b;
if (0 == a) return c;
if (1 == (a /= d)) return c + b;
f || (f = 0.3 * d);
g < Math.abs(b)
? ((g = b), (e = f / 4))
: (e = (f / (2 * Math.PI)) * Math.asin(b / g));
return (
-(
g *
Math.pow(2, 10 * (a -= 1)) *
Math.sin(((a * d – e) * 2 * Math.PI) / f)
) + c
);
},
easeOutElastic: function (e, a, c, b, d) {
var e = 1.70158,
f = 0,
g = b;
if (0 == a) return c;
if (1 == (a /= d)) return c + b;
f || (f = 0.3 * d);
g < Math.abs(b)
? ((g = b), (e = f / 4))
: (e = (f / (2 * Math.PI)) * Math.asin(b / g));
return (
g * Math.pow(2, -10 * a) * Math.sin(((a * d – e) * 2 * Math.PI) / f) +
b +
c
);
},
easeInOutElastic: function (e, a, c, b, d) {
var e = 1.70158,
f = 0,
g = b;
if (0 == a) return c;
if (2 == (a /= d / 2)) return c + b;
f || (f = d * 0.3 * 1.5);
g < Math.abs(b)
? ((g = b), (e = f / 4))
: (e = (f / (2 * Math.PI)) * Math.asin(b / g));
return 1 > a
? -0.5 *
g *
Math.pow(2, 10 * (a -= 1)) *
Math.sin(((a * d – e) * 2 * Math.PI) / f) +
c
: 0.5 *
g *
Math.pow(2, -10 * (a -= 1)) *
Math.sin(((a * d – e) * 2 * Math.PI) / f) +
b +
c;
},
easeInBack: function (e, a, c, b, d, f) {
void 0 == f && (f = 1.70158);
return b * (a /= d) * a * ((f + 1) * a – f) + c;
},
easeOutBack: function (e, a, c, b, d, f) {
void 0 == f && (f = 1.70158);
return b * ((a = a / d – 1) * a * ((f + 1) * a + f) + 1) + c;
},
easeInOutBack: function (e, a, c, b, d, f) {
void 0 == f && (f = 1.70158);
return 1 > (a /= d / 2)
? (b / 2) * a * a * (((f *= 1.525) + 1) * a – f) + c
: (b / 2) * ((a -= 2) * a * (((f *= 1.525) + 1) * a + f) + 2) + c;
},
easeInBounce: function (e, a, c, b, d) {
return b – jQuery.easing.easeOutBounce(e, d – a, 0, b, d) + c;
},
easeOutBounce: function (e, a, c, b, d) {
return (a /= d) < 1 / 2.75
? b * 7.5625 * a * a + c
: a < 2 / 2.75
? b * (7.5625 * (a -= 1.5 / 2.75) * a + 0.75) + c
: a < 2.5 / 2.75
? b * (7.5625 * (a -= 2.25 / 2.75) * a + 0.9375) + c
: b * (7.5625 * (a -= 2.625 / 2.75) * a + 0.984375) + c;
},
easeInOutBounce: function (e, a, c, b, d) {
return a < d / 2
? 0.5 * jQuery.easing.easeInBounce(e, 2 * a, 0, b, d) + c
: 0.5 * jQuery.easing.easeOutBounce(e, 2 * a – d, 0, b, d) + 0.5 * b + c;
}
});

// jQuery throttle / debounce – v1.1 – 3/7/2010
(function (b, c) {
var $ = b.jQuery || b.Cowboy || (b.Cowboy = {}),
a;
$.throttle = a = function (e, f, j, i) {
var h,
d = 0;
if (typeof f !== “boolean”) {
i = j;
j = f;
f = c;
}
function g() {
var o = this,
m = +new Date() – d,
n = arguments;
function l() {
d = +new Date();
j.apply(o, n);
}
function k() {
h = c;
}
if (i && !h) {
l();
}
h && clearTimeout(h);
if (i === c && m > e) {
l();
} else {
if (f !== true) {
h = setTimeout(i ? k : l, i === c ? e – m : e);
}
}
}
if ($.guid) {
g.guid = j.guid = j.guid || $.guid++;
}
return g;
};
$.debounce = function (d, e, f) {
return f === c ? a(d, e, false) : a(d, f, e !== false);
};
})(this);

// =============

// ====== sly slider init !!!
(function () {
var $frame = $(“#cycleitems”);
var $wrap = $frame.parent();

// Call Sly on frame
$frame.sly({
horizontal: 1,
itemNav: “basic”,
smart: 1,
activateOn: “click”,
mouseDragging: 1,
touchDragging: 1,
releaseSwing: 1,
startAt: 0,
scrollBar: $wrap.find(“.scrollbar”),
scrollBy: 1,
speed: 1000,
elasticBounds: 1,
easing: “easeOutExpo”,
dragHandle: 1,
dynamicHandle: 1,
clickBar: 1,

// Cycling
cycleBy: “items”,
cycleInterval: 2000,
pauseOnHover: 1,

// Buttons
prev: $wrap.find(“.prev”),
next: $wrap.find(“.next”)
});

// Pause button
$wrap.find(“.pause”).on(“click”, function () {
$frame.sly(“pause”);
});

// Resume button
$wrap.find(“.resume”).on(“click”, function () {
$frame.sly(“resume”);
});

// Toggle button
$wrap.find(“.toggle”).on(“click”, function () {
$frame.sly(“toggle”);
});
})();

</script>