hc-sticky
Version:
JavaScript library that makes any element on your page visible while you scroll
157 lines (134 loc) • 2.45 kB
HTML
<html>
<head>
<meta charset="UTF-8">
<title>jQuery test</title>
<meta name="description" content="HC-Sticky called with jQuery.">
<link rel="stylesheet" href="demo.css">
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script src="hc-sticky.js"></script>
<script>;
(function($) {
$(document).ready(function() {
var $sticky = $('aside');
$sticky.hcSticky({
stickTo: 'main',
responsive: {
980: {
disable: true
}
}
});
});
})(jQuery);
</script>
</head>
<body class="demo demo_1">
<header>
<figure></figure>
<nav>
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</nav>
</header>
<main>
<article>
<section>
<figure></figure>
<div>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
</div>
</section>
<section>
<figure></figure>
<div>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
</div>
</section>
<section>
<figure></figure>
<div>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
</div>
</section>
<section>
<figure></figure>
<div>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
</div>
</section>
<section>
<figure></figure>
<div>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
</div>
</section>
<section>
<figure></figure>
<div>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
</div>
</section>
</article>
<aside>
<div>
<h3></h3>
<ul>
<li></li>
<li></li>
<li></li>
</ul>
</div>
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
<div>
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
</aside>
</main>
<footer>
<span></span>
<span></span>
<span></span>
</footer>
</body>
</html>