yeah, added examples and rewrote some tabs n' button code
This commit is contained in:
parent
7d12d78eed
commit
e9ba01df76
12
README
12
README
@ -1,11 +1 @@
|
||||
<h3>Purpose</h3>
|
||||
<p>The purpose of this skeleton is to be a framework to jump off from any personal project, site or web app. It's starting very light and will continue to be so, but soon with extensible plugins and an easy to use architecture.</p>
|
||||
|
||||
<h3>To Do List<h3>
|
||||
<ul>
|
||||
<li>Forms</li>
|
||||
<li>Refine Buttons</li>
|
||||
<li>Browser Testing</li>
|
||||
<li>Mobile Grid and Styles</li>
|
||||
<li>Documentation</li>
|
||||
</ul>
|
||||
Skeleton is a small collection of CSS & JS files that can help you rapidly develop sites that look beautiful at any size, be it a 17" laptop screen or an iPhone.
|
BIN
Skeleton-1.0.zip
BIN
Skeleton-1.0.zip
Binary file not shown.
@ -114,6 +114,12 @@
|
||||
color: #333; }
|
||||
#grid .example-grid { overflow: hidden; }
|
||||
|
||||
#viewOnGithub {
|
||||
margin-bottom: 20px;
|
||||
font-size: 12px;
|
||||
color: #999;
|
||||
display: block; }
|
||||
|
||||
|
||||
.resize {
|
||||
position: fixed;
|
||||
|
@ -9,13 +9,12 @@
|
||||
================================================== -->
|
||||
<meta charset="utf-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <!-- Force Latest IE rendering engine -->
|
||||
<title><?= $page_title ?></title>
|
||||
<title>Skeleton: Beautiful Boilerplate for Responsive, Mobile-Friendly Development</title>
|
||||
<meta name="description" content="">
|
||||
<meta name="author" content="">
|
||||
|
||||
<!-- Mobile Specific Metas
|
||||
================================================== -->
|
||||
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
|
||||
|
||||
<!-- CSS
|
||||
@ -26,10 +25,9 @@
|
||||
<link rel="stylesheet" href="documentation-assets/docs.css">
|
||||
<!--[if lt IE9]><link rel="stylesheet" href="css/ie.css"><![endif]-->
|
||||
|
||||
<!-- Favicons
|
||||
<!-- Favicon
|
||||
================================================== -->
|
||||
<link rel="shortcut icon" href="/favicon.ico">
|
||||
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
|
||||
<link rel="shortcut icon" href="src/images/favicon.ico">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
@ -263,13 +261,14 @@
|
||||
<div class="doc-section" id="theFuture">
|
||||
<h3>The Future</h3>
|
||||
<p>As I write this, Skeleton is unreleased and I have just started using it in personal projects. In the future, I hope to build a small community around Skeleton - I want to get feedback, make it better and find the holes. </p>
|
||||
<p><strong>The ultimate goal is to build the best starting point for front-end development with an emphasis on simple, device-agnostic design.</strong> Help me get there - check out the project on Github or just email me (dhgamache [at] gmail.com) with questions/suggestions.</p>
|
||||
<p><strong>The ultimate goal is to build the best starting point for front-end development with an emphasis on simple, device-agnostic design.</strong>t Help me get there - <a href="https://github.com/dhgamache/Skeleton">check out the project on Github</a> or just email me - <em>dhgamache [at] gmail.com</em> - with questions/suggestions.</p>
|
||||
</div>
|
||||
<hr />
|
||||
<div class="doc-section" id="download">
|
||||
<h3>Download</h3>
|
||||
<p>The Skeleton download is a zip file (~50kb) containing all the CSS groundwork and JS goodies to get started on any web project. </p>
|
||||
<a href="files/" class="button">Download Skeleton 1.0</a>
|
||||
<a href="files/" class="button remove-bottom">Download Skeleton 1.0</a><br />
|
||||
<a href="https://github.com/dhgamache/Skeleton" id="viewOnGithub">View Source on Github</a>
|
||||
<p>The file structure for Skeleton is:</p>
|
||||
<ul class="square">
|
||||
<li><strong>index.html</strong>: The base html page that includes the necessary initial markup</li>
|
||||
@ -293,9 +292,15 @@
|
||||
<li>
|
||||
<strong>images</strong> <em>(folder)</em>
|
||||
</li>
|
||||
<li><strong>robots.txt</strong>: SEO, search-crawler file. Don't need to touch it, just there for your own good</li>
|
||||
<li><strong>404.html</strong>: Placeholder 404 page just to get you started</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<hr />
|
||||
<div class="doc-section" id="attribution">
|
||||
<p><em>Created by <a href="http://www.davegamache.com">Dave Gamache</a>, 2011 ©</em></p>
|
||||
</div>
|
||||
</div><!-- content -->
|
||||
</div><!-- container -->
|
||||
|
||||
<div class="resize"></div>
|
||||
@ -309,11 +314,9 @@
|
||||
================================================== -->
|
||||
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.js"></script>
|
||||
<script>window.jQuery || document.write("<script src='src/javascripts/jquery-1.5.1.min.js'>\x3C/script>")</script>
|
||||
<script src="src/javascripts/modernizr-1.7.min.js"></script>
|
||||
<script src="src/javascripts/app.js"></script>
|
||||
|
||||
<script>
|
||||
|
||||
$('.hidden-code').click(function(e) {
|
||||
e.preventDefault();
|
||||
$(this).children('.gist').slideToggle();
|
||||
@ -329,5 +332,6 @@
|
||||
$(this).html(originalText);
|
||||
})
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
@ -9,30 +9,42 @@
|
||||
================================================== -->
|
||||
<meta charset="utf-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <!-- Force Latest IE rendering engine -->
|
||||
<title><?= $page_title ?></title>
|
||||
<title>Skeleton: Beautiful Boilerplate for Responsive, Mobile-Friendly Development</title>
|
||||
<meta name="description" content="">
|
||||
<meta name="author" content="">
|
||||
|
||||
<!-- Mobile Specific Metas
|
||||
================================================== -->
|
||||
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
|
||||
<meta name="viewport" content="width=960" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
|
||||
|
||||
<!-- CSS
|
||||
================================================== -->
|
||||
<link rel="stylesheet" href="stylesheets/base.css">
|
||||
<link rel="stylesheet" href="stylesheets/skeleton.css">
|
||||
<link rel="stylesheet" href="stylesheets/ui.css">
|
||||
<link rel="stylesheet" href="stylesheets/layout.css">
|
||||
<!--[if lt IE9]><link rel="stylesheet" href="css/ie.css"><![endif]-->
|
||||
|
||||
<!-- JS (see footer for rest)
|
||||
================================================== -->
|
||||
<script src="javascripts/modernizr-1.7.min.js"></script>
|
||||
|
||||
<!-- Favicons
|
||||
<!-- Favicon
|
||||
================================================== -->
|
||||
<link rel="shortcut icon" href="/favicon.ico">
|
||||
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
|
||||
|
||||
<link rel="shortcut icon" href="src/images/favicon.ico">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
||||
|
||||
<div class="container">
|
||||
<h1 style="margin-top: 100px; text-align:center">Sorry. Couldn't Find That Page!</h1>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<!-- JS
|
||||
================================================== -->
|
||||
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.js"></script>
|
||||
<script>window.jQuery || document.write("<script src='javascripts/jquery-1.5.1.min.js'>\x3C/script>")</script>
|
||||
<script src="javascripts/app.js"></script>
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
BIN
src/images/favicon.ico
Normal file
BIN
src/images/favicon.ico
Normal file
Binary file not shown.
After Width: | Height: | Size: 1.1 KiB |
@ -1,9 +0,0 @@
|
||||
|
||||
<!-- JS
|
||||
================================================== -->
|
||||
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.js"></script>
|
||||
<script>window.jQuery || document.write("<script src='javascripts/jquery-1.5.1.min.js'>\x3C/script>")</script>
|
||||
<script src="javascripts/modernizr-1.7.min.js"></script>
|
||||
<script src="javascripts/app.js"></script>
|
||||
</body>
|
||||
</html>
|
71
src/index.html
Normal file
71
src/index.html
Normal file
@ -0,0 +1,71 @@
|
||||
<!doctype html>
|
||||
<!--[if lt IE 7 ]><html class="ie ie6" lang="en"> <![endif]-->
|
||||
<!--[if IE 7 ]><html class="ie ie7" lang="en"> <![endif]-->
|
||||
<!--[if IE 8 ]><html class="ie ie8" lang="en"> <![endif]-->
|
||||
<!--[if (gte IE 9)|!(IE)]><!--> <html lang="en"> <!--<![endif]-->
|
||||
<head>
|
||||
|
||||
<!-- Basic Page Needs
|
||||
================================================== -->
|
||||
<meta charset="utf-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <!-- Force Latest IE rendering engine -->
|
||||
<title>Page Title</title>
|
||||
<meta name="description" content="">
|
||||
<meta name="author" content="">
|
||||
|
||||
<!-- Mobile Specific Metas
|
||||
================================================== -->
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
|
||||
|
||||
<!-- CSS
|
||||
================================================== -->
|
||||
<link rel="stylesheet" href="stylesheets/base.css">
|
||||
<link rel="stylesheet" href="stylesheets/skeleton.css">
|
||||
<link rel="stylesheet" href="stylesheets/layout.css">
|
||||
<!--[if lt IE9]><link rel="stylesheet" href="css/ie.css"><![endif]-->
|
||||
|
||||
<!-- Favicon
|
||||
================================================== -->
|
||||
<link rel="shortcut icon" href="favicon.ico">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
||||
<!-- Primary Page Layout
|
||||
================================================== -->
|
||||
|
||||
<div class="container">
|
||||
<div class="sixteen columns">
|
||||
<h1 class="bottomless">Skeleton</h1>
|
||||
<p class="lead"><a href="http://www.skeleton.gs">skeleton.gs</a></p>
|
||||
</div>
|
||||
<div class="one column" style="background: #999; height: 400px;"></div>
|
||||
<div class="one column" style="background: #999; height: 400px;"></div>
|
||||
<div class="one column" style="background: #999; height: 400px;"></div>
|
||||
<div class="one column" style="background: #999; height: 400px;"></div>
|
||||
<div class="one column" style="background: #999; height: 400px;"></div>
|
||||
<div class="one column" style="background: #999; height: 400px;"></div>
|
||||
<div class="one column" style="background: #999; height: 400px;"></div>
|
||||
<div class="one column" style="background: #999; height: 400px;"></div>
|
||||
<div class="one column" style="background: #999; height: 400px;"></div>
|
||||
<div class="one column" style="background: #999; height: 400px;"></div>
|
||||
<div class="one column" style="background: #999; height: 400px;"></div>
|
||||
<div class="one column" style="background: #999; height: 400px;"></div>
|
||||
<div class="one column" style="background: #999; height: 400px;"></div>
|
||||
<div class="one column" style="background: #999; height: 400px;"></div>
|
||||
<div class="one column" style="background: #999; height: 400px;"></div>
|
||||
<div class="one column" style="background: #999; height: 400px;"></div>
|
||||
</div><!-- container -->
|
||||
|
||||
|
||||
<!-- JS
|
||||
================================================== -->
|
||||
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.js"></script>
|
||||
<script>window.jQuery || document.write("<script src='javascripts/jquery-1.5.1.min.js'>\x3C/script>")</script>
|
||||
<script src="javascripts/app.js"></script>
|
||||
|
||||
<!-- End Document
|
||||
================================================== -->
|
||||
</body>
|
||||
</html>
|
@ -1,29 +0,0 @@
|
||||
<? $title = "Page Title";
|
||||
include("includes/doc-head.php"); ?>
|
||||
|
||||
<div class="container">
|
||||
<nav class="five columns">
|
||||
<h1>Skeleton</h1>
|
||||
<ul>
|
||||
<li><a href="#whatAndWhy">What & Why</a></li>
|
||||
<li><a href="#basics">Basics</a></li>
|
||||
<li><a href="#typography">Typography</a></li>
|
||||
<li><a href="#grid">Grid</a></li>
|
||||
<li><a href="#buttons">Buttons</a></li>
|
||||
<li><a href="#tabs">Tabs</a></li>
|
||||
<li><a href="#forms">Forms</a></li>
|
||||
<li><a href="#mediaQueries">Media Queries</a></li>
|
||||
<li><a href="#theFuture">The Future</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<div class="eleven columns">
|
||||
<header>
|
||||
<p>Skeleton is a lightweight framework for HTML, CSS & jQuery that makes building websites easier.</p>
|
||||
</header>
|
||||
<br class="large" />
|
||||
<h3>What & Why</h3>
|
||||
<p>Here is where I need to chat about what Skeleton is, why itÕs awesome and how what the file structure is. Focus on: 1) Speed, 2) Best Practices , 3) Across devices</p>
|
||||
</div>
|
||||
</div><!-- container -->
|
||||
|
||||
<? include("includes/doc-foot.php"); ?>
|
5
src/robots.txt
Executable file
5
src/robots.txt
Executable file
@ -0,0 +1,5 @@
|
||||
# www.robotstxt.org/
|
||||
# www.google.com/support/webmasters/bin/answer.py?hl=en&answer=156449
|
||||
|
||||
User-agent: *
|
||||
|
@ -69,8 +69,8 @@
|
||||
h2 { font-size: 35px; line-height: 40px; margin-bottom: 10px; }
|
||||
h3 { font-size: 28px; line-height: 34px; margin-bottom: 8px; }
|
||||
h4 { font-size: 21px; line-height: 30px; margin-bottom: 4px; }
|
||||
h5 { font-size: 17px; line-height: 30px; font-weight: normal; }
|
||||
h6 { font-size: 14px; line-height: 30px; }
|
||||
h5 { font-size: 17px; line-height: 24px; font-weight: normal; }
|
||||
h6 { font-size: 14px; line-height: 21px; }
|
||||
.subheader { color: #777; }
|
||||
|
||||
p { margin: 0 0 20px; }
|
||||
@ -166,7 +166,7 @@
|
||||
|
||||
/* Hovers ---------- */
|
||||
.button:hover { background-color: #000; }
|
||||
.secondary.button:hover { background-color: #555; }
|
||||
.secondary.button:hover { background-color: #777; }
|
||||
|
||||
|
||||
|
||||
@ -194,15 +194,32 @@
|
||||
border: solid 1px #ddd;
|
||||
border-width: 1px 0 0 1px;
|
||||
margin: 0;
|
||||
background: #eee;
|
||||
background: #f5f5f5;
|
||||
font-size: 13px; }
|
||||
ul.tabs li a.active {
|
||||
background: #fff;
|
||||
height: 30px;
|
||||
height: 30px;
|
||||
position: relative;
|
||||
top: -4px;
|
||||
padding-top: 4px;
|
||||
border-right-width: 1px;
|
||||
margin: 0 -1px 0 0;
|
||||
color: #111; }
|
||||
color: #111;
|
||||
-moz-border-radius-topleft: 2px;
|
||||
-webkit-border-top-left-radius: 2px;
|
||||
border-top-left-radius: 2px;
|
||||
-moz-border-radius-topright: 2px;
|
||||
-webkit-border-top-right-radius: 2px;
|
||||
border-top-right-radius: 2px; }
|
||||
ul.tabs li:first-child a {
|
||||
-moz-border-radius-topleft: 2px;
|
||||
-webkit-border-top-left-radius: 2px;
|
||||
border-top-left-radius: 2px; }
|
||||
ul.tabs li:last-child a {
|
||||
border-width: 1px 1px 0 1px; }
|
||||
border-width: 1px 1px 0 1px;
|
||||
-moz-border-radius-topright: 2px;
|
||||
-webkit-border-top-right-radius: 2px;
|
||||
border-top-right-radius: 2px; }
|
||||
|
||||
ul.tabs-content { margin: 0; display: block; }
|
||||
ul.tabs-content > li { display:none; }
|
||||
@ -262,6 +279,11 @@
|
||||
font-weight: normal;
|
||||
font-size: 13px;
|
||||
color: #444; }
|
||||
|
||||
/* #Misc
|
||||
================================================== */
|
||||
.remove-bottom { margin-bottom: 0 !important; }
|
||||
.add-bottom { margin-bottom: 20px !important; }
|
||||
|
||||
|
||||
|
210
zurb.html
Normal file
210
zurb.html
Normal file
@ -0,0 +1,210 @@
|
||||
<!doctype html>
|
||||
<!--[if lt IE 7 ]><html class="ie ie6" lang="en"> <![endif]-->
|
||||
<!--[if IE 7 ]><html class="ie ie7" lang="en"> <![endif]-->
|
||||
<!--[if IE 8 ]><html class="ie ie8" lang="en"> <![endif]-->
|
||||
<!--[if (gte IE 9)|!(IE)]><!--> <html lang="en"> <!--<![endif]-->
|
||||
<head>
|
||||
|
||||
<!-- Basic Page Needs
|
||||
================================================== -->
|
||||
<meta charset="utf-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <!-- Force Latest IE rendering engine -->
|
||||
<title>Page Title</title>
|
||||
<meta name="description" content="">
|
||||
<meta name="author" content="">
|
||||
|
||||
<!-- Mobile Specific Metas
|
||||
================================================== -->
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
|
||||
|
||||
<!-- CSS
|
||||
================================================== -->
|
||||
<link rel="stylesheet" href="src/stylesheets/base.css">
|
||||
<link rel="stylesheet" href="src/stylesheets/skeleton.css">
|
||||
<link rel="stylesheet" href="src/stylesheets/layout.css">
|
||||
<link rel="stylesheet" href="documentation-assets/docs.css">
|
||||
<!--[if lt IE9]><link rel="stylesheet" href="css/ie.css"><![endif]-->
|
||||
|
||||
<!-- Favicon
|
||||
================================================== -->
|
||||
<link rel="shortcut icon" href="/favicon.ico">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
||||
|
||||
<div class="container">
|
||||
<div class="sixteen columns">
|
||||
<div id="content">
|
||||
|
||||
<div class="page-header home-header">
|
||||
<h1>Design for people.</h1>
|
||||
<h2>We're <a href="http://www.zurb.com/team/" title="Check out the ZURB Team">a close-knit team</a> of interaction designers<br> and strategists that help companies <a href="http://www.zurb.com/work" title="See some examples of our work">design better</a>.</h2>
|
||||
<hr />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="five columns">
|
||||
<h3>Who We Are</h3>
|
||||
<p>We're not just a web design agency. We're not just a graphic design firm. We're not just coders, and we're not just artists. <strong>We're a team of T-shaped interaction designers and design strategists who help grow businesses.</strong> (Oh, and we're not <em>just</em> dudes with expensive chairs, either.)</p>
|
||||
<p>To get an idea of how we work, take a look at one of <a href="http://www.zurb.net/zurbwired/projects/getting_started/index.php" title="ZURBwired Extranet">our extranet sites</a>. It's a project we did for a nonprofit in <a href="http://www.zurb.net/zurbwired/" title="ZURBwired Project">24 coffee-fueled hours</a>.</p>
|
||||
|
||||
<hr>
|
||||
|
||||
<h4>Latest Blog Posts</h4>
|
||||
<p>We write about <a href="/blog/topic/interaction-design">interaction design</a>, <a href="/blog/topic/interaction-design">design strategy</a>, and <a href="/blog/topics/">more</a> in our blog.</p>
|
||||
<ul class="recent blog-posts">
|
||||
|
||||
<li>
|
||||
<h5><a href="/article/608/full-set-of-stencils-for-sketching-iphone">Full Set of Stencils for Sketching iPhone, iPad & Android</a></h5>
|
||||
<small>3 hours ago by <a href="http://www.zurb.com/team/dmitry-dragilev" title="Learn more about Dmitry Dragilev">Dmitry</a> <span>¥</span> <a href="/article/608/full-set-of-stencils-for-sketching-iphone#comments">0 Comments</a></small>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<h5><a href="/article/659/simplify-your-product-features-early-on">Simplify Your Product Features Early On</a></h5>
|
||||
<small>1 day ago by <a href="http://www.zurb.com/team/dmitry-dragilev" title="Learn more about Dmitry Dragilev">Dmitry</a> <span>¥</span> <a href="/article/659/simplify-your-product-features-early-on#comments">5 Comments</a></small>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<h5><a href="/article/660/ui-problems-with-amazons-kindle">UI Problems with Amazon's Kindle?</a></h5>
|
||||
<small>2 days ago by <a href="http://www.zurb.com/team/dmitry-dragilev" title="Learn more about Dmitry Dragilev">Dmitry</a> <span>¥</span> <a href="/article/660/ui-problems-with-amazons-kindle#comments">6 Comments</a></small>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<h5><a href="/article/658/dont-bolt-customers-onto-your-idea">Don't Bolt Customers Onto Your Idea</a></h5>
|
||||
<small>3 days ago by <a href="http://www.zurb.com/team/dmitry-dragilev" title="Learn more about Dmitry Dragilev">Dmitry</a> <span>¥</span> <a href="/article/658/dont-bolt-customers-onto-your-idea#comments">0 Comments</a></small>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<h5><a href="/article/657/listen--dig-deeper">Listen & Dig Deeper</a></h5>
|
||||
<small>3 days ago by <a href="http://www.zurb.com/team/louis-corso" title="Learn more about Louis Corso">Louis</a> <span>¥</span> <a href="/article/657/listen--dig-deeper#comments">6 Comments</a></small>
|
||||
</li>
|
||||
|
||||
</ul>
|
||||
<p class="green more-link"><a href="http://www.zurb.com/blog">Visit the ZURBlog È</a></p>
|
||||
</div>
|
||||
|
||||
<div class="five columns" id="our-services">
|
||||
<h3>Our Services</h3>
|
||||
|
||||
<ol>
|
||||
<li>
|
||||
<h5><a href="/work/services/interaction_design_strategy" title="Read more about our Interaction Design and Strategy service">Interaction Design & Strategy</a></h5>
|
||||
We cut out all the funny reports and deliver actionable ideas for your online products.
|
||||
</li>
|
||||
<li>
|
||||
<h5><a href="/work/services/day_sessions" title="Read more about our Single Day Sessions service">Single Day Sessions</a></h5>
|
||||
Need some help right away? We'll get together for an entire day of strategy and design work.
|
||||
</li>
|
||||
<li>
|
||||
<h5><a href="/work/services/onsite_collaboration" title="Read more about our On-Site Collaboration service">On-Site Collaboration</a></h5>
|
||||
We love working together in bursts. It's where great ideas can get done fast.
|
||||
</li>
|
||||
<li>
|
||||
<h5><a href="/work/services/training_education" title="Read more about our Training and Education service">Training and Education</a></h5>
|
||||
We're gonna chop you up and turn you into a lean, mean start-up machine.
|
||||
</li>
|
||||
</ol>
|
||||
|
||||
<p><a href="http://www.zurb.com/work" title="Learn more about the work ZURB does">Learn more about our work È</a></p>
|
||||
|
||||
<hr>
|
||||
|
||||
<h4>Our Clients Love Us</h4>
|
||||
<p>If it weren't for our great clients, we wouldn't have gotten this far. Here's what they're saying:</p>
|
||||
|
||||
<blockquote>
|
||||
<p>ZURB brought to the table a well-thought-out process that allowed our team to focus on the creative aspects of our website design. They also came up with a number of suggestions that went well beyond our current thinking.</p>
|
||||
<cite><strong>Raymond King</strong> CEO, AboutUs</cite>
|
||||
</blockquote>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div class="five columns">
|
||||
<h3>100 Start-ups, Since 1998.</h3>
|
||||
<p>We've helped 100 start-ups since 1998, generating more than <strong>half a billion dollars</strong> in market capitalization from the leaders in several world markets.</p>
|
||||
|
||||
<ul id="worlds-greatest">
|
||||
<li id="facebook">
|
||||
<img src="images/logos/facebook.jpg" alt="facebook.com">
|
||||
<p>Largest Social Network<br>in the World</p>
|
||||
</li>
|
||||
<li id="yahoo">
|
||||
<img src="images/logos/yahoo.gif" alt="Yahoo.com">
|
||||
<p>World's Largest Network of Media Properties</p>
|
||||
</li>
|
||||
<li id="britney">
|
||||
<img src="images/logos/britney-spears-logo.jpg" alt="BritneySpears.com">
|
||||
<p><span>Most Searched Celebrity</span> Online, Two Years Running</p>
|
||||
</li>
|
||||
<li id="playlist">
|
||||
<img src="images/logos/playlist-logo.gif" alt="Playlist.com">
|
||||
<p><span>Fastest Growing Website</span> in the USA 2009</p>
|
||||
</li>
|
||||
<li id="zazzle">
|
||||
<img src="images/logos/zazzle-logo.gif" alt="Zazzle">
|
||||
<p>World's Largest Custom Products Marketplace</p>
|
||||
</li>
|
||||
<li id="ebay">
|
||||
<img src="images/logos/ebay-logo.gif" alt="eBay">
|
||||
<p>World's Largest Marketplace</p>
|
||||
</li>
|
||||
<li id="photobucket">
|
||||
<img src="images/logos/photobucket-logo.gif" alt="Photobucket">
|
||||
<p><span>World's Largest Photo</span> Sharing Website</p>
|
||||
</li>
|
||||
<li id="nyse">
|
||||
<img src="images/logos/nyse-logo.gif" alt="NYSE">
|
||||
<p>World's Most Prestigious Financial Institution</p>
|
||||
</li>
|
||||
|
||||
<li id="reuters">
|
||||
<img src="images/logos/reuters-logo.jpg" alt="Reuters">
|
||||
<p>World's Largest Multimedia News Agency</p>
|
||||
</li>
|
||||
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
(function() {
|
||||
var ve = document.createElement('script'); ve.type = 'text/javascript'; ve.async = true;
|
||||
ve.src = ('https:' == document.location.protocol ? 'https' : 'http') + '://zurb.verifyapp.com/embed/top-bar/8.js?buster=' + Math.random();
|
||||
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ve, s);
|
||||
})();
|
||||
</script>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<!-- JS
|
||||
================================================== -->
|
||||
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.js"></script>
|
||||
<script>window.jQuery || document.write("<script src='src/javascripts/jquery-1.5.1.min.js'>\x3C/script>")</script>
|
||||
<script src="src/javascripts/app.js"></script>
|
||||
|
||||
<script>
|
||||
$('.hidden-code').click(function(e) {
|
||||
e.preventDefault();
|
||||
$(this).children('.gist').slideToggle();
|
||||
})
|
||||
|
||||
var originalText;
|
||||
$('.example-grid').children().hover(
|
||||
function() {
|
||||
originalText = $(this).text();
|
||||
$(this).html($(this).width()+'px');
|
||||
},
|
||||
function() {
|
||||
$(this).html(originalText);
|
||||
})
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
Loading…
Reference in New Issue
Block a user