1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980 |
- <!doctype html>
- <!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ -->
- <!--[if lt IE 7]> <html class="no-js ie6 oldie" lang="en"> <![endif]-->
- <!--[if IE 7]> <html class="no-js ie7 oldie" lang="en"> <![endif]-->
- <!--[if IE 8]> <html class="no-js ie8 oldie" lang="en"> <![endif]-->
- <!--[if gt IE 8]><!-->
- <html class="no-js" lang="en"> <!--<![endif]-->
- <head>
- <meta charset="utf-8">
- <title>Typogr.js example</title>
- <meta name="description" content="Typogr.js example">
- <meta name="author" content="Eugene Kalinin">
- <link rel="stylesheet" href="style.css">
- <link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Alice|Volkhov">
- <style>
- .amp {
- color: #666;
- font-family: "Alice";
- font-size: 150%;
- font-style: italic;
- }
- .dquo {
- font-family: "Volkhov";
- margin-left: -.5em;
- font-size: 1.5em;
- }
- footer {
- font-family: "Alice";
- }
- header {
- font-family: "Alice";
- }
- </style>
- </head>
- <body>
- <div id="container">
- <header>
- <h1>
- This is an example of using
- <a href="https://github.com/ekalinin/typogr.js">Typogrify utils for JavaScript »</a>
- </h1>
- </header>
- <div class="post">
- <h2>Untypogrified</h2>
- <div id="src">
- <h3>"Jayhawks" & KU fans act extremely obnoxiously</h3>
- <p> By J.D. Salinger, Lorem ipsum dolor sit amet, consectetur adipisicing elit,
- sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. "Excepteur
- sint occaecat 'cupidatat' non proident" sunt RFID22 in....
- </p>
- <p>
- The tea--with cardamom and other spices--was delicious and fragrant.
- </p>
- </div>
- </div>
- <div class="post">
- <h2>Typogrified</h2>
- <div id="res" />
- </div>
- <footer> <a href="https://github.com/ekalinin">Eugene Kalinin </a> © 2011 </footer>
- </div>
- <!-- JavaScript here ... -->
- <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
- <script src="../typogr.js"></script>
- <script>
- $(document).ready(function() {
- $('#res').html(
- typogr.typogrify( $('#src') )
- );
- })
- </script>
- </body>
- </html>
|