WebSVN - Integrator Subversion - Blame - Rev 1 - /DOCUMENTOS E ANALISE/telas/assets/global/plugins/carousel-owl-carousel/demos/one.html

Rev	Author	Line No.	Line
1	espaco	1	<!DOCTYPE html>
		2	<html lang="en">
		3	<head>
		4	<meta charset="utf-8">
		5	<title>Owl Carousel - One slide</title>
		6	<meta name="viewport" content="width=device-width, initial-scale=1.0">
		7	<meta name="description" content="jQuery Responsive Carousel - Owl Carusel">
		8	<meta name="author" content="Bartosz Wojciechowski">
		9
		10	<link href='http://fonts.googleapis.com/css?family=Open+Sans:400italic,400,300,600,700' rel='stylesheet' type='text/css'>
		11	<link href="../assets/css/bootstrapTheme.css" rel="stylesheet">
		12	<link href="../assets/css/custom.css" rel="stylesheet">
		13
		14	<!-- Owl Carousel Assets -->
		15	<link href="../owl-carousel/owl.carousel.css" rel="stylesheet">
		16	<link href="../owl-carousel/owl.theme.css" rel="stylesheet">
		17
		18	<link href="../assets/js/google-code-prettify/prettify.css" rel="stylesheet">
		19
		20	<!-- Le fav and touch icons -->
		21	<link rel="apple-touch-icon-precomposed" sizes="144x144" href="../assets/ico/apple-touch-icon-144-precomposed.png">
		22	<link rel="apple-touch-icon-precomposed" sizes="114x114" href="../assets/ico/apple-touch-icon-114-precomposed.png">
		23	<link rel="apple-touch-icon-precomposed" sizes="72x72" href="../assets/ico/apple-touch-icon-72-precomposed.png">
		24	<link rel="apple-touch-icon-precomposed" href="../assets/ico/apple-touch-icon-57-precomposed.png">
		25	<link rel="shortcut icon" href="../assets/ico/favicon.png">
		26	</head>
		27	<body>
		28
		29	<div id="top-nav" class="navbar navbar-fixed-top">
		30	<div class="navbar-inner">
		31	<div class="container">
		32	<button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
		33	<span class="icon-bar"></span>
		34	<span class="icon-bar"></span>
		35	<span class="icon-bar"></span>
		36	</button>
		37	<div class="nav-collapse collapse">
		38	<ul class="nav pull-right">
		39	<li><a href="../index.html"><i class="icon-chevron-left"></i> Back to Frontpage</a></li>
		40	<li><a href="../owl.carousel.zip" class="download download-on" data-spy="affix" data-offset-top="450">Download</a></li>
		41	</ul>
		42	<ul class="nav pull-left">
		43
		44	</ul>
		45	</div>
		46	</div>
		47	</div>
		48	</div>
		49
		50	<div id="title">
		51	<div class="container">
		52	<div class="row">
		53	<div class="span12">
		54	<h1>One Item with Image</h1>
		55	</div>
		56	</div>
		57	</div>
		58	</div>
		59
		60	<div id="demo">
		61	<div class="container">
		62	<div class="row">
		63	<div class="span12">
		64	<div id="owl-demo" class="owl-carousel">
		65
		66	<div class="item"><img src="assets/fullimage1.jpg" alt="The Last of us"></div>
		67	<div class="item"><img src="assets/fullimage2.jpg" alt="GTA V"></div>
		68	<div class="item"><img src="assets/fullimage3.jpg" alt="Mirror Edge"></div>
		69
		70	</div>
		71	</div>
		72	</div>
		73	</div>
		74	</div>
		75
		76	<div id="example-info">
		77	<div class="container">
		78	<div class="row">
		79	<div class="span12">
		80	<h1>Setup</h1>
		81	<p>In order for the images to auto fit to slider containers use width 100% on <img>. Check CSS below</p>
		82	<ul class="nav nav-tabs" id="myTab">
		83	<li class="active"><a href="#javascript">Javascript</a></li>
		84	<li><a href="#HTML">HTML</a></li>
		85	<li><a href="#CSS">CSS</a></li>
		86	</ul>
		87
		88	<div class="tab-content">
		89
		90	<div class="tab-pane active" id="javascript">
		91	<pre class="pre-show prettyprint linenums">
		92	$(document).ready(function() {
		93
		94	$("#owl-demo").owlCarousel({
		95
		96	navigation : true, // Show next and prev buttons
		97	slideSpeed : 300,
		98	paginationSpeed : 400,
		99	singleItem:true
		100
		101	// "singleItem:true" is a shortcut for:
		102	// items : 1,
		103	// itemsDesktop : false,
		104	// itemsDesktopSmall : false,
		105	// itemsTablet: false,
		106	// itemsMobile : false
		107
		108	});
		109
		110	});
		111	</pre>
		112
		113	</div>
		114
		115	<div class="tab-pane" id="HTML">
		116	<pre class="pre-show prettyprint linenums">
		117	<div id="owl-demo" class="owl-carousel owl-theme">
		118
		119	<div class="item"><img src="assets/fullimage1.jpg" alt="The Last of us"></div>
		120	<div class="item"><img src="assets/fullimage2.jpg" alt="GTA V"></div>
		121	<div class="item"><img src="assets/fullimage3.jpg" alt="Mirror Edge"></div>
		122
		123	</div>
		124	</pre>
		125	</div>
		126
		127	<div class="tab-pane" id="CSS">
		128	<pre class="pre-show prettyprint linenums">
		129	#owl-demo .item img{
		130	display: block;
		131	width: 100%;
		132	height: auto;
		133	}
		134	</pre>
		135	</div>
		136	</div><!--End Tab Content-->
		137
		138	</div>
		139	</div>
		140	</div>
		141	</div>
		142
		143	<div id="more">
		144	<div class="container">
		145
		146	<div class="row">
		147	<div class="span12">
		148	<h1>More Demos</h1>
		149	</div>
		150	</div>
		151
		152	<div class="row demos-row">
		153	<div class="span3">
		154	<a href="images.html" class="demo-box">
		155	<div class="demo-wrapper demo-images clearfix">
		156	<div class="demo-slide"><div class="bg"></div></div>
		157	<div class="demo-slide"><div class="bg"></div></div>
		158	<div class="demo-slide"><div class="bg"></div></div>
		159	</div>
		160	<h3>Images</h3>
		161	</a>
		162	</div>
		163
		164	<div class="span3">
		165	<a href="custom.html" class="demo-box">
		166	<div class="demo-wrapper demo-custom clearfix">
		167	<div class="demo-slide"><div class="bg"></div></div>
		168	<div class="demo-slide"><div class="bg"></div></div>
		169	<div class="demo-slide"><div class="bg"></div></div>
		170	<div class="demo-slide"><div class="bg"></div></div>
		171	<div class="demo-slide"><div class="bg"></div></div>
		172	<div class="demo-slide"><div class="bg"></div></div>
		173	<div class="demo-slide"><div class="bg"></div></div>
		174	<div class="demo-slide"><div class="bg"></div></div>
		175	<div class="demo-slide"><div class="bg"></div></div>
		176	<div class="demo-slide"><div class="bg"></div></div>
		177	</div>
		178	<h3>Custom</h3>
		179	</a>
		180	</div>
		181
		182	<div class="span3">
		183	<a href="itemsCustom.html" class="demo-box">
		184	<div class="demo-wrapper demo-full clearfix">
		185	<div class="demo-slide"><div class="bg"></div></div>
		186	<div class="demo-slide"><div class="bg"></div></div>
		187	<div class="demo-slide"><div class="bg"></div></div>
		188	<div class="demo-slide"><div class="bg"></div></div>
		189	</div>
		190	<h3>Custom 2</h3>
		191	</a>
		192	</div>
		193
		194	<div class="span3">
		195	<a href="one.html" class="demo-box">
		196	<div class="demo-wrapper demo-one clearfix">
		197	<div class="demo-slide"><div class="bg"></div></div>
		198	</div>
		199	<h3>One Slide</h3>
		200	</a>
		201	</div>
		202
		203	</div>
		204	<div class="row demos-row">
		205	<div class="span3">
		206	<a href="json.html" class="demo-box">
		207	<div class="demo-wrapper demo-Json clearfix">
		208	<div class="demo-slide"><div class="bg"></div></div>
		209	<div class="demo-slide"><div class="bg"></div></div>
		210	<div class="demo-slide"><div class="bg"></div></div>
		211	<div class="demo-slide"><div class="bg"></div></div>
		212	<div class="demo-slide"><div class="bg"></div></div>
		213	</div>
		214	<h3>JSON</h3>
		215	</a>
		216	</div>
		217
		218	<div class="span3">
		219	<a href="customJson.html" class="demo-box">
		220	<div class="demo-wrapper demo-Json-custom clearfix">
		221	<div class="demo-slide"><div class="bg"></div></div>
		222	<div class="demo-slide"><div class="bg"></div></div>
		223	<div class="demo-slide"><div class="bg"></div></div>
		224	</div>
		225	<h3>JSON Custom</h3>
		226	</a>
		227	</div>
		228
		229	<div class="span3">
		230	<a href="lazyLoad.html" class="demo-box">
		231	<div class="demo-wrapper demo-lazy clearfix">
		232	<div class="demo-slide"><div class="bg"></div></div>
		233	<div class="demo-slide"><div class="bg"></div></div>
		234	<div class="demo-slide"><div class="bg"></div></div>
		235	</div>
		236	<h3>Lazy Load</h3>
		237	</a>
		238	</div>
		239
		240	<div class="span3">
		241	<a href="autoHeight.html" class="demo-box">
		242	<div class="demo-wrapper demo-height clearfix">
		243	<div class="demo-slide"><div class="bg"></div></div>
		244	</div>
		245	<h3>Auto Height</h3>
		246	</a>
		247	</div>
		248
		249	</div>
		250	</div>
		251	</div>
		252
		253	<div id="footer">
		254	<div class="container">
		255	<div class="row">
		256	<div class="span12">
		257	<h5>Bartosz Wojciechowski 2013 / @OwlFonk /
		258	<a href="mailto:owl@owlgraphic.com?subject=Hey Owl!">email</a> /
		259	<a href="../changelog.html">changelog</a> /
		260	<a href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=EFSGXZS7V2U9N">donate</a> /
		261	<a href="https://twitter.com/share" class="twitter-share-button" data-url="http://owlgraphic.com/owlcarousel/" data-text="Awesome jQuery Owl Carousel Responsive Plugin" data-via="OwlFonk" data-count="none" data-hashtags="owlcarousel"></a>
		262	<script>
		263	var owldomain = window.location.hostname.indexOf("owlgraphic");
		264	if(owldomain !== -1){
		265	!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');
		266	}
		267	</script>
		268	</h5>
		269	</div>
		270	</div>
		271	</div>
		272	</div>
		273
		274
		275	<script src="../assets/js/jquery-1.9.1.min.js"></script>
		276	<script src="../owl-carousel/owl.carousel.js"></script>
		277
		278
		279	<!-- Demo -->
		280
		281	<style>
		282	#owl-demo .item img{
		283	display: block;
		284	width: 100%;
		285	height: auto;
		286	}
		287	</style>
		288
		289
		290	<script>
		291	$(document).ready(function() {
		292	$("#owl-demo").owlCarousel({
		293
		294	navigation : true,
		295	slideSpeed : 300,
		296	paginationSpeed : 400,
		297	singleItem : true
		298
		299	// "singleItem:true" is a shortcut for:
		300	// items : 1,
		301	// itemsDesktop : false,
		302	// itemsDesktopSmall : false,
		303	// itemsTablet: false,
		304	// itemsMobile : false
		305
		306	});
		307	});
		308	</script>
		309
		310	<script src="../assets/js/bootstrap-collapse.js"></script>
		311	<script src="../assets/js/bootstrap-transition.js"></script>
		312	<script src="../assets/js/bootstrap-tab.js"></script>
		313
		314	<script src="../assets/js/google-code-prettify/prettify.js"></script>
		315	<script src="../assets/js/application.js"></script>
		316
		317	</body>
		318	</html>

Subversion Repositories Integrator Subversion

(root)/DOCUMENTOS E ANALISE/telas/assets/global/plugins/carousel-owl-carousel/demos/one.html - Rev 1