2 files changed, 58 insertions, 0 deletions
diff --git a/views/default/magic_topbar/css.php b/views/default/magic_topbar/css.php
new file mode 100644
index 000000000..718c09bd0
--- /dev/null
+++ b/views/default/magic_topbar/css.php
@@ -0,0 +1,18 @@
+<?php
+/**
+ * Magic Topbar CSS
+ *
+ * @package ElggMagicTopbar
+*/
+?>
+
+/* Magic Topbar Plugin */
+
+.elgg-page-topbar{
+	position: fixed;
+	width:100%;
+}
+.elgg-page-header {
+	margin-top: 0px;
+	padding-top: 24px;
+}
diff --git a/views/default/magic_topbar/js.php b/views/default/magic_topbar/js.php
new file mode 100644
index 000000000..cb51913f3
--- /dev/null
+++ b/views/default/magic_topbar/js.php
@@ -0,0 +1,40 @@
+<?php
+/**
+ * Hide the topbar when no using with an animation.
+ *
+ * @package ElggMagicTopbar
+ */
+?>
+
+$(function() {
+
+	var $topbar   = $(".elgg-page-topbar"),
+		$window   = $(window);
+
+	$topbar.css({position: 'fixed', width: '100%'});
+
+	$window.scroll(function() {
+		$topbar.stop();
+		var opacity;
+		if ($window.scrollTop() > 14) {
+			$topbar.animate({opacity: 0}, 'fast');
+		} else {
+			$topbar.css({opacity: 1});
+		}
+	});
+
+	$topbar.mouseenter(function(){
+		$topbar.stop();
+		$topbar.animate({opacity: 1});
+	})
+	.mouseleave(function(){
+		$topbar.stop();
+		var opacity;
+		if ($window.scrollTop() > 14) {
+			opacity = 0;
+		} else {
+			opacity = 1;
+		}
+		$topbar.animate({opacity: opacity});
+	});
+});