Biblioteca de JavaScript para las estructuras de pasos simples-StepJs
| Autor: | ahlechandre |
|---|---|
| Views Total: | 1,284 |
| Sitio oficial: | Ir a la web |
| Actualizado: | August 12, 2015 |
| Licencia: | MIT |
Vista prévia
Descripción
StepJs es una biblioteca de ayuda de JavaScript para proporcionar estructuras de pasos simples en su página web.
Funcionamiento
En primer lugar, incluya los StepJs en el documento.
<script async src="stepjs.min.js"></script>
StepJs tiene sólo un requisito CSS. Pon estas reglas en tu hoja de estilo.
.step-content > *
{
display: none;
} A continuación, establezca el marcado de las estructuras de anclajes y pasos. Asegúrese de hacer coincidir el valor de anclajes de los pasos de datos con el identificador de la estructura de paso relacionada. Agregue la clase activa al ancla del contenido que se debe mostrar inicial. Si no establece el contenido activo, se mostrará el primero. La estructura del paso independiente del elemento HTML así que sea libre de elegir. Y además, ID no necesita ser secuencial.
<!-- anchors --> <a href="#step-1" data-steps="step-example">go to step 1</a> <a href="#step-2" data-steps="step-example" class="active">go to step 2</a> <a href="#step-3" data-steps="step-example">go to step 3</a> <!-- step structure --> <div id="step-example" class="step-content"> <div id="step-1"> <h1>Step 1</h1> </div> <div id="step-2"> <h1>Step 2</h1> </div> <div id="step-3"> <h1>Step 3</h1> </div> </div>
