>

Junio 20

2017
Ejemplo

Novelty JAVASCRIPT 1.0.0

Es una utilidad para poder mostrar en la web una serie de novedades, o un simple ayudante para mostrar, paso a paso, como se hace, por ejemplo. Es una herramienta bastante sencilla de utilizar con algunas funciones avanzadas, para un uso un poco mas amplio y con mas posibilidades.

Como se usa

Descarga el fichero novelty.zip y descomprimelo dentro de tu web. Como norma general estara en la carpeta http://[dominio]/novelty. Luego haz la refetencia en tu pagina web al fichero novelty.js. Luego crea una variable que sea un objeto de novelty var Novelty = noveltyJS(); Y por ultimo, ya dependiendo un poco de lo que necesites, si cuando carga la web o al pusar sobre un boton llamas al procedimiento start() para ejecutar las novedades.

Definicion de las novedades

    "News": "Novelty[1 to X]": {
"Title":"My Title X",
"message":"My message HTML"},
"Buttons": {
"[Title]":{
"class": "[class name]",
"step":"[step option]"}
}
}

En class puede poner el nombre de la clase a utilizar para el boton, por defecto es blue o gray

En step debe indicar:

  •    -1 para anterior
  •    0 para saltar
  •    +1 para avanzar

   En step tambien puede incluir el nombre de una funcion externa y enviarle variables. El formato tiene que ser:

       {"Func":"[nombre de la funcion]", "Vars":"[variable u objeto que utilice tu funcion]"} Ademas tambien se envia el numero de STEP que esta en curso.

Puede obtener el numero de STEP con llamando a .getStep() en su objeto.

Recuerde que en el interior de message ya se incluye un parrafo por lo que debe de cerrar con /p antes de abrir un nuevo parra con p.

La funcion exit() cierra Novelty.

Ejemplo de uso

< script src="/novelty/Novelty.js">
< script type="text/javascript">
var Novelty = noveltyJS();
$(document).ready(function () {
params = {
'News': {
'Novelty1': {
'title': 'Title 1',
'message': 'bla bla bla 1'
},
'Novelty2': {
'title': 'Title 2',
'message': 'bla bla bla 2'
},
'Novelty3': {
'title': 'Title 3',
'message': 'bla bla bla 3'
},
'Novelty4': {
'title': 'Title 4',
'message': 'bla bla bla 4'
},
'Novelty5': {
'title': 'Title 5',
'message': 'bla bla bla 5'
}
},
'Buttons': {
'Back': {
'class': 'blue',
'step': '-1'
},
'Skip': {
'class': 'gray',
'step': '0'
},
'Next': {
'class': 'blue',
'step': '+1'
}
}
}
Novelty.setNovelties(params);
Novelty.start();
});
< /script>

La variable Novelty puede ser global o privada, la diferencia esta en si necesitas utilizar las variables que te puede devolver para utilizarlas en otras funciones de tu codigo JAVASCRIPT o no.

#novelty #javascript


0 Comentarios

Help2.JPG Ejemplo
Help1.JPG


Archivo