Bootstrap+Timeliner+Github+JQUERY创建程序员的简历(三)---OnePageNav
为了保证在浏览的时候不影响整体的效果,我们就需要使用onePageNav,也就是页内导航
最后效果可见:http://about.phodal.com 或者http://gmszone.github.io/RESUME/
源码可见:https://github.com/gmszone/RESUME/tree/master/Web
<div class="collapse navbar-collapse navbar-ex1-collapse subMenu"> <ul class="nav navbar-nav" id="top-nav"> <li href="#section-1"><a href="#">在校情况</a></li> <li ><a href="#section-2" >项目经历</a></li> <li ><a href="#section-3" >其他项目、经历</a></li> <li ><a href="#section-4" >专业技能</a></li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">简历下载 <span class="glyphicon glyphicon-download-alt"></span> <b class="caret"></b></a> <ul class="dropdown-menu" > <li><a href="https://github.com/gmszone/RESUME/blob/master/Personal/all.pdf?raw=true">全版本</a></li> <li><a href="https://github.com/gmszone/RESUME/blob/master/Personal%20Web/web.pdf?raw=true">web专用</a></li> <li><a href="https://github.com/gmszone/RESUME/blob/master/Personal%20Embeded/Embeded.pdf?raw=true">嵌入式专用</a></li> <li><a href="https://github.com/gmszone/RESUME/blob/master/word/Phodal%20Huang.docx?raw=true">Word</a></li> </ul> </li> </ul> <form name="search-highlight" id="search-highlight" method="post" action="#" class="navbar-form navbar-right" role="search"> <input name="term" id="term" class="text form-control2" placeholder="页面内搜索"/> <input type="submit" name="submit" id="submit" class="btn btn-info" value="搜索" /> </form> </div><!-- /.navbar-collapse -->