dock effect

app/assets/javascripts/orbitdesktop.js

@@ -274,3 +274,33 @@ var orbitDesktop = function(dom){
 
 orbitDesktop.prototype.themefolder = "themes";
 
+// devin
+(function(){
+	$(document).ready(function(){
+		var $widget_fn = $('.widget_fn'),
+			$fn_des = $('.fn_des');
+
+		$widget_fn.hover(function(){
+			var fn_name = $(this).find('img').attr('alt'),
+				nth = $(this).parents('.d_cate').index(),
+				des_left = $('.dock_child').eq(nth).width();
+
+
+			$(this).addClass('thmc1');
+			$fn_des
+				.text(fn_name)
+				.css({
+					'top':nth * 60,
+					'left': des_left + 60
+				})
+				.stop(true, true)
+				.fadeIn();
+		}, function(){
+			$(this).removeClass('thmc1');
+			$fn_des.stop(true, true).fadeOut();
+		});
+	
+	});
+	
+
+}());

app/assets/stylesheets/desktopmain.css

@@ -89,6 +89,32 @@ a { text-decoration: none; }
 	height: 30px;
 	margin: 15px 0 0 15px;
 	}
+.docklist {
+
+	}
+.docklist li {
+	position: relative;
+	}
+.dock_child {
+	display: none;
+	overflow: hidden;
+	position: absolute;
+	left: 60px;
+	top: 0;
+	}
+.docklist > li:hover .dock_child { display: block; }
+.dock_item { float: left; }
+.fn_des.thmtxt {
+	line-height: 60px;
+	padding: 0 6px;
+	font-size: 15px;
+	position: absolute;
+	min-width: 48px;
+	text-align: center;
+	white-space: nowrap;
+	display: none;
+	}
+
 .ini_input {
 	margin: 0;
 	padding: 0;
@@ -249,19 +275,6 @@ a { text-decoration: none; }
 	font-size: 15px;
 }
 
-/* fake Orbit bar */
-#orbitbar {
-	height: 28px;
-	border-radius: 0px;
-	padding-top: 2px;
-	padding-bottom: 1px;
-	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.8);
-	background-image: -webkit-linear-gradient(top, #444, #111);
-	position: absolute;
-	z-index: 9999;
-	top: 0;
-	width: 100%;
-}
 #group_wrapper{
 	
 }

app/assets/stylesheets/style.css.erb

@@ -1,3 +1,4 @@
+@import url(http://fonts.googleapis.com/css?family=Cuprum);
 @font-face{ 
 	font-family: 'WebSymbolsRegular';
 	src: url(<%= asset_path 'websymbols-regular-webfont.eot' %>);