"Manual de usuario"
Bootstrap 3.3.0 Snippet by AldoPilgrim

Post to Facebook Tweet this

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
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<script src="https://use.fontawesome.com/15deb57482.js"></script>
</head>
<header>
<div class="container">
<div class="col-xs-12 col-sm-6 col-sm-offset-3">
<div class="alert alert-info vertical-center">
<p>En el presente manual se describe la forma de operar el Módulo de Registro de Visitas el cual tiene como objetivo llevar el control de los registros de entradas y salidas, movimientos de personal y la consulta de los catálogos. </p>
</div>
</div>
</div>
</header>
<div class="container">
<div class="hidden-xs col-sm-3">
<div class="fading-side-menu" data-spy="affix" data-offset-top="350">
<h5>Contenido</h5><hr class="no-margin">
<ul class="list-unstyled">
<li>
<a href="#contra">
<span class="fa fa-angle-double-right text-primary"></span>Cambio de Contraseña
</a>
</li>
<li>
<a href="#principal">
<span class="fa fa-angle-double-right text-primary"></span>Menú Principal
</a>
</li>
<li>
<a href="#registro">
<span class="fa fa-angle-double-right text-primary"></span>Menú de Registro de Visitas
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
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
/* FOR DEMO ONLY */
/* Import Bootswatch paper theme because it isn't provided by Bootsnipp and it is awesome! */
@import url(//cdnjs.cloudflare.com/ajax/libs/bootswatch/3.3.4/paper/bootstrap.min.css);
@import url(//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.3.0/css/font-awesome.min.css);
/* WHAT YOU NEED */
.fading-side-menu.affix-top {
opacity: 1;
transition: opacity 1s
}
.fading-side-menu.affix {
top: 11.5px;
}
.fading-side-menu.affix {
opacity: 0.2;
transition: opacity 5s
}
.fading-side-menu.affix:hover {
opacity: 1;
transition: opacity 0.3s
}
/* RECOMMENDED STYLING BUT NOT REQUIRED */
.fading-side-menu a {
color: rgb(102, 102, 102);
}
.fading-side-menu a .fa {
padding-right:15px;
}
/* FOR DEMO ONLY */
body {
background-color: rgb(255, 255, 255);
font-size: 16px;
}
header {
background: url('https://unsplash.imgix.net/photo-1427955569621-3e494de2b1d2?fit=crop&fm=jpg&h=700&q=75&w=1050') no-repeat center bottom;
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
/* THOUGH THIS PLUGIN DOES NOT CONTAIN
ANY JAVASCRIPT ITSELF, IT DOES REQUIRE
THE BOOTSTRAP AFFIX PLUGIN. */
/* START OF DEMO JS - NOT NEEDED */
$(function () {
if (window.location == window.parent.location) {
$('#fullscreen').html('<span class="fa fa-compress"></span>');
$('#fullscreen').attr('href', 'http://bootsnipp.com/mouse0270/snippets/rVnOR');
$('#fullscreen').attr('title', 'Back To Bootsnipp');
}
$('#fullscreen').on('click', function(event) {
event.preventDefault();
window.parent.location = $('#fullscreen').attr('href');
});
$('#fullscreen').tooltip();
});
/* END DEMO OF JS - THAT IS RIGHT NO ADDITONAL JAVASCRIPT NEEDED FOR THIS SNIPPET */
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More

Paper Kit

Questions / Comments: