diff --git a/app/views/open_source_projects/index.html.erb b/app/views/open_source_projects/index.html.erb
index 5cb93ea63..50d2fbb5e 100644
--- a/app/views/open_source_projects/index.html.erb
+++ b/app/views/open_source_projects/index.html.erb
@@ -19,6 +19,163 @@
 	</table>
 	<% end %>
 </div>
+<style type="text/css">
+.tb-navigation {
+	position: relative;
+	z-index: 400;
+}
+blockquote, body, button, code, dd, div, dl, dt, fieldset, form, h1, h2, h3, h4, h5, h6, input, legend, li, ol, p, pre, td, textarea, th, ul {
+	margin: 0;
+	padding: 0;
+}
+
+.navigation {
+	color: #666;
+	border: 2px solid #d7d6d6;
+}
+
+.nav-switch {
+	position: absolute;
+	top: 0;
+	right: 0;
+	border-width: 14px;
+	border-color: #bdbdbd #bdbdbd transparent transparent;
+	border-style: solid solid dashed dashed;
+	z-index: 10;
+}
+
+.navigation .nav-switch-icon {
+	background-position: -266px 3px;
+}
+.navigation .icon-search, .navigation .nav-pill-cancle, .navigation .nav-switch-icon, .navigation .nav-topbar .topbar-search .topbar-submit, .navigation .nav-topbar-arror {
+	background: url();
+}
+.nav-switch-icon {
+	width: 15px;
+	height: 15px;
+	position: absolute;
+	top: -13px;
+	right: -13px;
+	cursor: pointer;
+}
+.nav-topbar, .type-min {
+	position: relative;
+}
+.nav-category-group {
+	clear: both;
+}
+.nav-topbar {
+	background-color: #f5f4f4;
+	border-bottom: 1px solid #e4e4e4;
+	z-index: 4;
+}
+.nav-topbar .nav-topbar-content {
+	line-height: 36px;
+	padding: 0 16px;
+	overflow: hidden;
+}
+.nav-topbar-content {
+	margin: 0 4px;
+	white-space: nowrap;
+}
+ol, ul {
+	list-style: none;
+}
+ul, menu, dir {
+	display: block;
+	list-style-type: disc;
+	-webkit-margin-before: 1em;
+	-webkit-margin-after: 1em;
+	-webkit-margin-start: 0px;
+	-webkit-margin-end: 0px;
+	-webkit-padding-start: 40px;
+}
+.nav-topbar .nav-topbar-content {
+	line-height: 36px;
+}
+li {
+	margin-right: 7px;
+	float: left;
+}
+
+.type-line{
+	overflow: hidden;
+}
+.nav-category-group{
+	clear: both;
+}
+.type-line .nav-category{
+	clear: both;
+	position: relative;
+	padding: 0 100px 0 107px;
+	height: 20px;
+	overflow: hidden;
+	margin-top: 11px;
+	margin-bottom: 11px;
+}
+.nav-category h4{
+	position: absolute;
+	color: #666;
+	font-weight: 400;
+	left: 22px;
+	top: 0;
+	overflow: hidden;
+	max-width: 68px;
+	white-space: nowrap;
+	text-overflow: ellipsis;
+	padding-right: 5px;
+	text-align: left;
+}
+</style>
+<%#======================================================================box before%>
+<div class="tb-navigation" data-spm="a230r.1.3">
+	<div class="navigation">
+		<div class="nav-switch">
+				<a href="javascript:(function (){$('.nav-content').toggle();})();">
+			<div class="nav-switch-icon J_Switch" trace="navHideButton" title="收起导航">
+            </div>
+				</a>
+        </div>
+
+        <div class="nav-container">
+            <div class="nav-topbar nav-category-group" data-group="nav-topbar">
+                <div class="nav-topbar-content">
+                    <ul>
+                        <li class="has-arrow">所有分类<span class="nav-topbar-arror"></span>
+                        </li>
+                        <li>
+                        	<span class="topbar-search J_TopbarSearch">
+                                <input class="search-input input-placeholder" _default="该条件下查找" placeholder="该条件下查找" accesskey="s">
+                                <span class="topbar-submit"></span>
+                            </span>
+                        </li>
+						<li>共 <span class="h">1.61万</span> 件宝贝</li>
+						<li class="related-count"><a href="/search?q=iphone&amp;app=vproduct&amp;vlist=1&amp;from_combo=true">8款相关产品</a></li>
+					</ul>
+				</div>
+				<div class="nav-category-panel"></div>
+			</div>
+			<div class="nav-content">
+				<!-- 推荐属性-->
+				<div class="nav-category-group type-line" data-group="type-line">
+					<div class="nav-category ">
+						<h4 title="网络类型">网络类型<span>：</span></h4>
+						<a href="javascript:void(0)" class="nav-more J_More show">更多
+							<span class="arrow arrow-bottom"></span>
+						</a>
+					</div>	
+					<div class="nav-category ">
+						<h4 title="网络类型">网络类型<span>：</span></h4>
+						<a href="javascript:void(0)" class="nav-more J_More show">更多
+							<span class="arrow arrow-bottom"></span>
+						</a>
+					</div>
+				</div>
+			</div>
+		</div>
+	</div>
+</div>
+<%#======================================================================box after%>
 
 <div id="projects-index">