BANNER AD

BANNER AD

by Andrew Pougher

HTML

<script src="http://andrewpougher.co.uk/examples/banners/js/lettering.js"></script>
<script src="http://andrewpougher.co.uk/examples/banners/js/modernizr.custom.js"></script>
		<div class="ski-words" id="ski-words">
				<h2>Ski</h2>
				<h2>to live</h2>
				<h2>and LIVE</h2>
				<h2>to SKI</h2>
				<h2>CHAMONIX</h2>
				<h2>MARCH 2013</h2>
				<h2>On the Snow</h2>
				<h2>BE THERE</h2>
			</div>

CSS

@font-face {
  font-family: 'Dosis';
  font-style: normal;
  font-weight: 200;
  src: local('Dosis ExtraLight'), local('Dosis-ExtraLight'), url(http://themes.googleusercontent.com/static/fonts/dosis/v2/zuuDDmIlQfJeEM3Uf6kkpnYhjbSpvc47ee6xR_80Hnw.woff) format('woff');
}
@font-face {
  font-family: 'Dosis';
  font-style: normal;
  font-weight: 600;
  src: local('Dosis SemiBold'), local('Dosis-SemiBold'), url(http://themes.googleusercontent.com/static/fonts/dosis/v2/f8qltGyj2S-SS_tsOHsjgXYhjbSpvc47ee6xR_80Hnw.woff) format('woff');
}

@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700|Dosis:200,600);


body{font-family: 'Lato', Calibri, Arial, sans-serif;
	color: #fff;
	background: rgba(194,240,252,1);
background: -moz-linear-gradient(-45deg, rgba(194,240,252,1) 0%, rgba(194,240,252,1) 5%, rgba(147,206,222,1) 20%, rgba(117,189,209,1) 80%, rgba(73,165,191,1) 100%);
background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(194,240,252,1)), color-stop(5%, rgba(194,240,252,1)), color-stop(20%, rgba(147,206,222,1)), color-stop(80%, rgba(117,189,209,1)), color-stop(100%, rgba(73,165,191,1)));
background: -webkit-linear-gradient(-45deg, rgba(194,240,252,1) 0%, rgba(194,240,252,1) 5%, rgba(147,206,222,1) 20%, rgba(117,189,209,1) 80%, rgba(73,165,191,1) 100%);
background: -o-linear-gradient(-45deg, rgba(194,240,252,1) 0%, rgba(194,240,252,1) 5%, rgba(147,206,222,1) 20%, rgba(117,189,209,1) 80%, rgba(73,165,191,1) 100%);
background: -ms-linear-gradient(-45deg, rgba(194,240,252,1) 0%, rgba(194,240,252,1) 5%, rgba(147,206,222,1) 20%, rgba(117,189,209,1) 80%, rgba(73,165,191,1) 100%);
background: linear-gradient(135deg, rgba(194,240,252,1) 0%, rgba(194,240,252,1) 5%, rgba(147,206,222,1) 20%, rgba(117,189,209,1) 80%, rgba(73,165,191,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c2f0fc', endColorstr='#49a5bf', GradientType=1 );}


.ski-words h2 {
	font-family: 'Dosis', 'Lato', sans-serif;
	font-size:...

JavaScript

$(document).ready(function() {
    	
        $("#ski-words > h2").lettering('words').children("span").lettering().children("span").lettering(); 
       
    
    
    
  
    });