Problema con active y bootstrap
Publicado por Sergio (1 intervención) el 20/09/2017 19:39:46
Estoy usando este código y esperaba que al dar click en mi botón, la clase active se cambiara de uno a otro, sin embargo, no hace lo esperado, alguna idea de la razón??
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
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
<body data-spy="scroll" data-target="navegacion" >
<div class="container">
<header>
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navegacion">
<span class="sr-only">Mostrar navegacion</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a href="#" class="navbar-brand"> Logotipo</a>
</div>
<div class="collapse navbar-collapse" id="navegacion">
<ul class="nav navbar-nav" role="tablist">
<li class="active" ><a href="#inicio"> Inicio</a></li>
<li ><a href="#equipo"> Equipo</a></li>
<li ><a href="#contacto"> Contacto</a></li>
</ul>
</div>
</nav>
</header>
</div>
<div class="container" id="inicio">
<section class="main row" >
<article class="col-xs-12 carrusel">
<img src="images/ZKTeco_logo_0316.png" class="img-responsive" alt="NOT FOUND">
</article>
</section>
</div>
<div class="container" >
<section class="informacion row">
<div class="col-xs-12 col-sm-4">
<h2>Nuestro equipo</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Fugiat pariatur fugit ea sed, eos corporis aperiam eum quas voluptatum voluptates iusto sit fuga sint itaque, officiis, non, consequatur id illum!</p>
</div>
<div class="col-xs-12 col-sm-4">
<h2>Servicios</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolor aperiam quibusdam labore ex recusandae tempora eligendi sed dolore placeat quis consequatur debitis alias enim officia, quos vel tempore velit qui!</p>
</div>
<div class="col-xs-12 col-sm-4 contacto">
<h2>Contáctanos</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quidem id harum ut aliquid doloremque explicabo sequi esse aut, reprehenderit repudiandae sed laborum quisquam optio expedita officiis! Sequi quasi perspiciatis odio?</p>
</div>
</section>
</div>
<div class="container">
<section class="noticias row">
<div class="col-xs-12 col-sm-8">
<h2>Noticias y Publicaciones </h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Labore, dolores, aliquid! Officiis corrupti alias porro nulla laboriosam exercitationem perferendis sequi maiores! Quis doloribus fuga omnis facilis veniam maiores assumenda explicabo!</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Labore, dolores, aliquid! Officiis corrupti alias porro nulla laboriosam exercitationem perferendis sequi maiores! Quis doloribus fuga omnis facilis veniam maiores assumenda explicabo!</p>
</div>
<div class="col-xs-12 col-sm-4">
<h2>Area de conocimientos</h2>
<nav>
<ul>
<li>Reloj checador</li>
<br>
<li>Detectores de metal</li>
<br>
<li>Barreras</li>
</ul>
</nav>
</div>
</section>
</div>
<div class="container" id="equipo">
<section class="equipo row espacio">
<h2>EQUIPO DE DESARROLLO </h2>
<div class=" col-md-3">
<h3>Experto en redes</h3>
<img src="images/persona-silueta-de-negocios-con-corbata_318-49988.jpg" alt="" class="img-responsive">
<br>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sunt, voluptates nemo quidem deserunt possimus consectetur. Voluptatibus maiores quas, nesciunt! Quaerat et pariatur provident suscipit tenetur eum possimus, impedit maxime facere.</p>
</div>
<div class="col-md-3 personal">
<h3>Experto en hardware</h3>
<img src="images/persona-silueta-de-negocios-con-corbata_318-49988.jpg" alt="" class="img-responsive">
<br>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Hic corrupti ipsum praesentium sit eius veritatis. Corporis, minima, ducimus recusandae cupiditate, minus quisquam aut quo pariatur explicabo molestiae atque totam repellendus.</p>
</div>
<div class="col-md-3">
<h3>Lider de desarrollo</h3>
<img src="images/mujer-oscura-forma-el-pelo-largo_318-46940.jpg" alt="" class="img-responsive">
<br>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci est aperiam ipsa minus magni, consequatur, odit velit reprehenderit ab animi iste officiis natus, laudantium, ratione minima porro! Rem, repudiandae, qui.</p>
</div>
<div class="col-md-3 personal">
<h3>Expero en software</h3>
<img src="images/persona-silueta-de-negocios-con-corbata_318-49988.jpg" alt="" class="img-responsive">
<br>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cupiditate sapiente odio voluptatum! Accusantium, architecto, rerum? Sequi architecto, libero provident voluptatibus saepe quo tempora est natus! Dolores quo voluptas rerum ad!</p>
</div>
</section>
</div>
<div class="container" id="contacto">
<h2>PARA SABER MÁS DE NOSOTROS </h2>
<form class="form-horizontal" role="form">
<div class="form-group">
<label for="inputEmail3" class="col-sm-2 control-label">NOMBRE</label>
<div class="col-sm-10">
<input type="email" class="form-control" id="inputEmail3" placeholder="Email">
</div>
</div>
<div class="form-group">
<label for="inputPassword3" class="col-sm-2 control-label">TELÉFONO</label>
<div class="col-sm-10">
<input type="password" class="form-control" id="inputPassword3" placeholder="Password">
</div>
</div>
<div class="form-group">
<label for="inputPassword3" class="col-sm-2 control-label">CORREO</label>
<div class="col-sm-10">
<input type="password" class="form-control" id="inputPassword3" placeholder="Password">
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button type="submit" class="btn btn-default">Registrate</button>
</div>
</div>
</form>
</div>
Valora esta pregunta
0