slideheader
Version:
A JavaScript plugin to display or hide headerbar with a sliding motion
46 lines (41 loc) • 1.1 kB
HTML
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="./style.css">
<link rel="stylesheet" href="../dist/cbslideheader.css">
</head>
<body>
<header class="cb-header header1">header1</header>
<header class="cb-header header2">header2</header>
<div style="background-color: #eee;" class="cb-header2"></div>
<div style="height: 2000px"></div>
<script src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
<script src="../dist/jquery.cbslideheader.min.js"></script>
<script>
$(".header1").cbSlideDownHeader({
zIndex: 1,
slideUpCallback: function () {
alert("slideUp1");
},
slideDownCallback: function () {
alert("slideDown1");
}
//headerClone: true,
//fullscreenView: true
});
$(".header2").cbSlideUpHeader({
zIndex: 0,
slideUpCallback: function () {
alert("slideUp2");
},
slideDownCallback: function () {
alert("slideDown2");
}
//headerClone: true,
//fullscreenView: true
//slideDownCallback: function () {alert("aaa");}
});
</script>
</body>
</html>