Como crear un startup?

Prototype, xilinusTe gusta netvibes? te gustaria hacer algo parecido talves no un startup pero si una aplicacion funcional y que se pueda adaptar bien y usar bloques del mismo modo que lo hacen ahi no solo el startup de netvibes hay muchos mas entre ellos el de google, yahoo y otros.

Pues bueno en xilinus que ya estan acostumbrandonos a sacar clases basadas en prototype bastante completas y de muy buena calidad ahora sacan esta Prototype Portal Class.

Aqui les dejo el ejemplo de como aplicarlo:

Primero el HTML facil y sencillo:

<div id="page"><div id="widget_col_0"></div><div id="widget_col_1"></div>    <div id="widget_col_2"></div>    </div>

Toca el archivo CSS aun mas facil:

#page {margin: 10px auto;}    #widget_col_0 {    float:left;    width: 30%;    }    #widget_col_1 {    width: 50%;    float:left;    }    #widget_col_2 {    float:left;    width: 20%;    }

Ahora iniciamos la clase:

    var  portal = new Xilinus.Portal("#page div")

Y por ultimo añadamos las cajitas (widgets) =P

portal.add(new Xilinus.Widget(), 0)// Or with title and contentportal.add(new Xilinus.Widget().setTitle("Widget Title").setContent("bla bla bla"), 1);

Eso es todo nada dificil pero ahora quieres mas estilo mas bonito mas funciones aqui les pongo mas de esto:

  • url: Url a la que se hace una peticion despues de mover un widget (default null, no requests)
  • onOverWidget: Un evento para ejecutar cuando el mouse este sobre el widget (default null)
  • onOutWidget: Evento para cuando el mouse ya quite de encima del widget (default null)
  • onChange: Evento para ejecutar algo cuando termines de mover el widget (drag & drop) (default null)
  • onUpdate: Evento para ejecutar cuando termines de ejecutar un accion drag & drop (default null)
  • removeEffect: Remueve un efecto animado (sin efectos por default)

Muchas funciones no lo creo se podrian hacer mas pero bueno aqui lo basico para crear este portal:

  • add(widget, columnIndex): para añadir un nuevo widget .
  • remove(widget): remueve un widget.
  • serialize(): Convierte un string a parametros para el request de lajax.

Batante bueno el tip no creen? puede ser muy util creo ya se donde lo aplicare, ya pueden hacer su propio startup bueno casi falta mucho jeje pero lo basico ya lo tiene un poquito de CSS y JS es mas que suficiente.

Ver ejemplo / Descargar Script widgets.js

comment ¿Que opinas?

Artículos recientes

close

Hurdy-Gurdy, un diseño de instrumento musical mecanizado y sustentable

Hurdy-Gurdy es el nombre que recibe esta Zanfona mecanizada realizada por UGEARS; la cual, busca apoyo mediante Kickstarter para hacerse realidad. Este impresionante modelo mecánico de una Zanfona es completamente funcional y autónoma además como…

close

Este es el primer tráiler de Forces of Destiny, la nueva serie de Star Wars

Forces of Destiny es la nueva serie de Disney basada en el universo de Star Wars; esta nueva serie de animación llega para ampliar la historia de varios personajes de la serie como Leía, Jyn…

close

Marcas innovadoras que han cambiando la forma de mover al mundo

El día de hoy quiero compartir con ustedes una infografía que muestra algunas de las marcas que han cambiado al mundo; esta infografía las señala como aquellas que han alterado el Statu Quo en diferentes…

close

Conoce a los ganadores del iPhone Photography Awards 2017

El iPhone Photography Awards 2017 ya tiene ganadores y entre los miles de competidores de alrededor de 140 países; El IPP Awards como se le conoce es un concurso donde participan todas las fotografías que hayan…

close

play_circle_outline Nike apoya la diversidad de género en su nuevo comercial

Nike, una de las marcas más reconocidas en el mundo de los deportes ha lanzado su nuevo anuncio en redes sociales el pasado 22 de Junio; el cual, muestra como la marca apoya la diversidad…

close

Impresionantes paisajes espaciales creados a mano por Adam Makarenko

Adam Makarenko es un fotógrafo que ha demostrado su habilidad al lente y con las manos con esta increíble sesión fotográfica creativa;. Con un genial aspecto estas fotografías podrían parecer que son emitidas por la…

notifications Recién publicamos
close