IntroAPIs/carousel.html at master · sethwainer/IntroAPIs · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
<html>
<head>
	<title>SoundBlastr</title>
	<link rel="stylesheet" href="bootstrap.css">
	<link rel="stylesheet" type="text/css" href="main.css">
	<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script>
	$(function() {

		$('#backtotop').fadeOut("fast");

		$(window).scroll(function() { // when the page is scrolled run this
			if($(this).scrollTop() != 0) { // if you're NOT at the top
				$('#backtotop').fadeIn("fast"); // fade in
			} else { // else
			$('#backtotop').fadeOut("fast"); // fade out
			}
		});

		$('#backtotop').click(function () {
			$('body,html').animate({
				scrollTop: 0
			}, 800);
			return false;
		});

		$('a').click(function(){
			$('html, body').animate({
				scrollTop: $( $(this).attr('href') ).offset().top
			}, 500);
		return false;
		});

		$.getJSON('http://data.buenosaires.gob.ar/api/3/action/datastore_search?resource_id=4dcec0c7-7cee-4ff6-ac83-7d92b39b3f69').done(function(data) {
			alert(data.result.records[0].web);
		});

	});
	</script>
</head>
<body>
		<!-- Navbar -->
    <header class="navbar navbar-static-top bs-docs-nav" id="top" role="banner">
	  <div class="container">
	    <div class="navbar-header">
	      <button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".bs-navbar-collapse">
	        <span class="sr-only">Toggle navigation</span>
	        <span class="icon-bar"></span>
	        <span class="icon-bar"></span>
	        <span class="icon-bar"></span>
	      </button>
	      <a href="../" class="navbar-brand">SoundBlast</a>
	    </div>
	    <nav class="collapse navbar-collapse bs-navbar-collapse" role="navigation">
	      <ul class="nav navbar-nav">
	        <li>
	          <a href="#about">About</a>
	        </li>
	        <li>
	          <a href="#how">How It Works</a>
	        </li>
	        <li>
	          <a href="#songs">Sample Artists</a>
	        </li>
	      </ul>
	      <ul class="nav navbar-nav navbar-right">
	        <li><a href="#login">Signup</a></li>
	        <li><a href="#login">Login</a></li>
	      </ul>
	    </nav>
	  </div>
	</header>

	<section id="hero">
		<div class="jumbotron">
			<h1>Welcome to SoundBlastr</h1>
			<h3>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sit, voluptas, voluptatibus, aut minus impedit odit inventore dolor ipsam ab quaerat quibusdam eum voluptatem doloribus illo nam dicta accusamus. Quae, saepe?</h3>
		</div>

		<div class="btn btn-block btn-success big-btn">Sign Up!</div>
	</section>

	<section id="how">
		<div class="container">
			<h2>How It Works</h2>
			<div class="row">
				<div class="col-lg-2">
					<h3>Sign Up</h3>
					<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quae, pariatur natus voluptates commodi rerum illum nulla laboriosam explicabo! Numquam, provident dolores a quia quam dignissimos tempore obcaecati fugiat dolore natus?</p>
				</div>
				<div class="col-lg-2">
					<h3>List Your Prefs</h3>
					<img class="img-responsive" src="http://a.gifb.in/072011/1310646593_satr_trek__head_tennis.gif">
					<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nisi, ullam, ad, laborum dolorem aliquam nobis ducimus veniam inventore excepturi beatae laudantium quam aperiam cum quia ab enim nesciunt. Temporibus, reprehenderit!</p>
				</div>
				<div class="col-lg-8">
					<h3>Enjoy Your Music!</h3>
					<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Porro, aperiam, voluptates delectus nesciunt iusto dolor vitae pariatur dolorem debitis reprehenderit deleniti eaque recusandae libero totam doloribus temporibus doloremque! Autem, assumenda.</p>
				</div>
			</div>
		</div>
		<section id="login">
			<div class="container">
				<div class="col-lg-6">
					<h3>SIGN UP</h3>

				</div>
			</div>
		</section>

	</section>

</body>
<footer>
	<a href="#" class="btn btn-danger btn-mini pull-right" id="backtotop"><i class="icon-white icon-arrow-up"></i> Back To Top</a>
</footer>
</html>