Skip to content

Instantly share code, notes, and snippets.

@JDMcKinstry
Forked from bmegod/gist:5731763
Last active December 18, 2015 07:29
Show Gist options
  • Save JDMcKinstry/5746681 to your computer and use it in GitHub Desktop.
Save JDMcKinstry/5746681 to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html class="no-js">
<head>
<!-- Include meta data first, although this is slowly becoming less read by modern browsers -->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta http-equiv="cache-control" content="no-cache" />
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- set page title, remember, this can be changed with page ajaxes by using jQuery mark up of `$("title").text("Some String");` -->
<title>HTML Mockup | Foxcode</title>
<!-- Load Css first, common practice, sometimes a plugin may rely on certain element positions to make changes. -->
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/bootstrap-responsive.css">
<link rel="stylesheet" href="css/main.css">
<!-- TIP:
Include all JS libraries here.
Modernizer should be loaded before jQuery.
Modernizer can be used to load jQuery, but is not necesary.
see also: http://modernizr.com/docs/#load
This is really only necesary if jQuery cannot be loaded with header (like old wordpress pages)
or if you're going to use a similar lib like MooTools (not recomended)
-->
<script src="js/vendor/modernizr-2.6.2-respond-1.1.0.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <!--TIP: you coulde change this to a local copy !!!-->
<script src="js/vendor/bootstrap.min.js"></script>
<script src="js/plugins.js"></script>
<script src="js/main.js"></script>
<!-- TIP:
As written in the ID's, these are simply test areas.
Test any code you might want to add to the page here,
before making it a permanent addition to it's perspective file.
-->
<style type="text/css" id="styTestArea">
/* CSS TEST AREA */
html, body { }
</style>
<script type="text/javascript" id="scrTestArea">
/* JAVASCRIPT TEST AREA */
$(function() { // <-- same as $(document).ready()
})
</script>
</head>
<body>
<div id="background"><img src="img/layout/bg_home.jpg" height="100%" width="100%"/></div>
<div class="container-fluid" id="content-area">
<!-- ==========================================================================
* Start Navigation
=========================================================================== -->
<div class="row-fluid" id="nav-row">
<div class="navbar">
<div class="navbar-inner">
<div class="container">
<!-- .btn-navbar is used as the toggle for collapsed navbar content -->
<div id="nav-button">
<a class="btn btn-navbar" id="btn-nav-drop" data-toggle="collapse" data-target=".nav-collapse"><span class="icon-chevron-down"></span></a>
</div><!-- #/nav-button->
<!-- Everything you want hidden at 940px or less, place within here -->
<div id="top" class="nav-collapse collapse">
<!-- .nav, .navbar-search, .navbar-form, etc -->
<ul class="nav" id="navigation">
<li class="nav-link nav-anim"><a id='homelogo' href=".">Home</a></li>
<li class="nav-link nav-anim dropdown"><a href="#foxcode" class="nav-link-ajax" id="toggle-about">About</a>
<ul class="dropdown-menu" id="dropdown-about">
<li><a href="#foxcode" class="nav-link-ajax">About</a></li>
<li><a href="#difference" class="nav-link-ajax">Our Difference</a></li>
<li><a href="#strategy" class="nav-link-ajax">Strategy</a></li>
</ul>
</li>
<li class="nav-link nav-anim dropdown"><a href="#principals" class="nav-link-ajax" id="toggle-team">Team</a>
<ul class="dropdown-menu" id="dropdown-team">
<li><a href="#principals" class="nav-link-ajax">Principals</a></li>
<li><a href="#team" class="nav-link-ajax">Team</a></li>
</ul>
</li>
<li class="nav-link nav-anim dropdown">
<a class="nav-link-ajax" href="#mergers-and-acquisition-advisory" data-toggle="dropdown" id="dropdown-toggle-services">Services</a>
<ul class="dropdown-menu" id="dropdown-services">
<li><a href="#mergers-and-acquisition-advisory" class="nav-link-ajax">Mergers &amp; Acquisition Advisory</a></li>
<li><a href="#corporate-advisory-and-capital-raising" class="nav-link-ajax">Corporate Advisory &amp; Capital Raising</a></li>
<li><a href="#merchant-banking-and-private-equity" class="nav-link-ajax">Merchant Banking &amp; Private Equity</a></li>
<li><a href="#alternative-asset-management" class="nav-link-ajax">Alternative Asset Management</a></li>
<li><a href="#project-finance" class="nav-link-ajax">Project Finance</a></li>
<li><a href="#real-estate" class="nav-link-ajax">Real Estate</a></li>
</ul>
</li>
<li class="nav-link nav-anim"><a href="#news" class="nav-link-ajax">News</a></li>
<li class="nav-link nav-anim"><a href="#contact" class="nav-link-ajax" id="contact-link">Contact</a></li>
</ul>
</div><!-- ./nav-collapse -->
</div><!-- ./container -->
</div><!-- .navbar-inner -->
</div><!-- .navbar -->
</div><!-- ./row-fluid -->
<!-- ==========================================================================
* Start Content
=========================================================================== -->
<div class="row-fluid" id="content-row">
<div class="span12">
<div class="row-fluid">
<div class="span4" id="home-logo">
<img src="img/layout/logo.png" id="logo">
<ul id="subnav"><!-- Loaded via AJAX --></ul>
</div><!-- ./span4 -->
<div class="span8" id="home-copy">
<p id="home-p">Foxcode is an investment and merchant banking Firm which advises and invests in small to mid-market companies and projects globally.</p>
</div><!-- ./span8 -->
</div><!-- ./row-fluid -->
</div><!-- span12 -->
</div><!-- ./row-fluid -->
<!-- ==========================================================================
* Start Footer
=========================================================================== -->
<div class="row-fluid" id="footer-row">
<div class="span12">
<ul id="footer-list">
<li>&copy; 2013 Foxcode, Inc. All Rights Reserved</li>
<li> | </li>
<li><a href="javascript:void(0);">Legal</a></li>
<li> | </li>
<li><a href="javascript:void(0);">Privacy</a></li>
<li> | </li>
<li><a href="#contact" class="nav-link-ajax" id="contact-link">Contact<a/></li>
</ul>
</div><!-- ./span12 -->
</div><!-- ./row-fluid -->
</div><!-- ./container-fluid -->
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment