JSFiddle

gnel's public fiddles

• Angular JS example

  AngularJS 1.0.2, HTML, CSS, JavaScript

• Private fiddle Extra
• Delete fiddle
Groups Extra
• CSS progress bar animation

  Nice progress bar animation done with css and jquery .animate()

• Private fiddle Extra
• Delete fiddle
Groups Extra
• Bootstrap and snap.js integration

  Taken from http://stackoverflow.com/q/16726270/352672

• Private fiddle Extra
• Delete fiddle
Groups Extra
• jquerymobile collapsible list nested dynamic

  jQuery 1.9.1, HTML, CSS, JavaScript

• Private fiddle Extra
• Delete fiddle
Groups Extra
• Google Maps Api animating marker example

  From http://stackoverflow.com/a/16384990/352672

• Private fiddle Extra
• Delete fiddle
Groups Extra
• jQuery text implosion

  See:http://stackoverflow.com/questions/6538546/jquery-animated-text/6538963#6538963

• Private fiddle Extra
• Delete fiddle
Groups Extra
• ZPRNV

  jQuery 1.7.2, HTML, CSS, JavaScript

• Private fiddle Extra
• Delete fiddle
Groups Extra
• Custom gallery with loupe zoom plugin

  From this SO question: http://stackoverflow.com/questions/16102002/re-bind-jquery-plugin-to-selector-after-property-change

• Private fiddle Extra
• Delete fiddle
Groups Extra
• jquery multiple same animation avoid multiple callbacks

  Solution to avoid multiple nested callbacks when doing the same animation on multiple elements. SO question: http://stackoverflow.com/questions/15688191/jquery-animation-quene-for-many-elements Credits by nickf of: http://stackoverflow.com/a/505619/352672

• Private fiddle Extra
• Delete fiddle
Groups Extra
• Hbsyb

  No-Library (pure JS), HTML, CSS, JavaScript

• Private fiddle Extra
• Delete fiddle
Groups Extra
• make jqueryui dialogs z-index go our way

  Make the a first created ui dialog to be shown on top, which the default is otherwise. See SO question of this fiddle: http://stackoverflow.com/questions/15222008/jquery-ui-limiting-overlay-z-index

• Private fiddle Extra
• Delete fiddle
Groups Extra
• Juego estilo Apalabrados

  Sacado de esta pregunta en SO: http://stackoverflow.com/questions/13176089/adding-keydown-to-click-event

• Private fiddle Extra
• Delete fiddle
Groups Extra
• Detect from which side the mouse entered a div

  From this SO question: http://stackoverflow.com/questions/15020393/jquery-any-chance-to-detect-from-which-side-the-mouse-entered-a-div-without-the

• Private fiddle Extra
• Delete fiddle
Groups Extra
• GridPhotoAnim v3

  La mejora sobre v2, se ha simplificado el layout y prescindimos del div .ovfcont y ponemos el width y height que antes iba en .ovfcont directamente en el container .centerout Tambien se actualiza a jquery 1.9.1 para la funcion finish() para parar las animaciones de divs circundantes al pasar de un div a otro. La mejora sobre v1 se ha hecho en la primera imagen, a la que hemos metido en un tercer div, para lograr efecto de "overflow: hidden" dentro de una TD (en nuestro caso div con display table-cell) ya que las TD por defecto se expanden para acomodar el contenido. El metodo usado es el de http://stackoverflow.com/a/9443662/352672 En el div que contiene a la imagen (o contenido) que queremos hacer overflow, esto es "div.ovfcont", hay que fijar un ancho/alto especifico (110px en nuestro fiddle) para que el overflow funcione a partir de esos limites. Recordatorio: La v1 solo se encargo, partiendo de nuestro fiddle de responsiveness grid de imagenes con texto, de añadirle 'css vertical centering images ' con un metodo que fuera animate(width, height) friendly. Recordatorio: estos fiddle tratan de emular la interface en: http://www.templatemonster.com/flash-templates/27545.html

• Private fiddle Extra
• Delete fiddle
Groups Extra
• jquery 1.9 animation finish example

  Jquery 1.9 .finish method example. Example animation

• Private fiddle Extra
• Delete fiddle
Groups Extra
• s63MR

  jQuery 1.7.2, HTML, CSS, JavaScript

• Private fiddle Extra
• Delete fiddle
Groups Extra
• newlines linebreaks in javascript variable

  jQuery 1.8.3, HTML, CSS, JavaScript

• Private fiddle Extra
• Delete fiddle
Groups Extra
• GridPhotoAnim v2

  La mejora sobre v1 se ha hecho en la primera imagen, a la que hemos metido en un tercer div, para lograr efecto de "overflow: hidden" dentro de una TD (en nuestro caso div con display table-cell) ya que las TD por defecto se expanden para acomodar el contenido. El metodo usado es el de http://stackoverflow.com/a/9443662/352672 En el div que contiene a la imagen (o contenido) que queremos hacer overflow, esto es "div.ovfcont", hay que fijar un ancho/alto especifico (110px en nuestro fiddle) para que el overflow funcione a partir de esos limites. Recordatorio: La v1 solo se encargo, partiendo de nuestro fiddle de responsiveness grid de imagenes con texto, de añadirle 'css vertical centering images ' con un metodo que fuera animate(width, height) friendly. Recordatorio: estos fiddle tratan de emular la interface en: http://www.templatemonster.com/flash-templates/27545.html

• Private fiddle Extra
• Delete fiddle
Groups Extra
• GridPhotoAnim v1

  V1 partiendo de fiddle "Ejemplo Image tiles thumbnails layout" para recrear interface de: http://www.templatemonster.com/flash-templates/27545.html Se añadio capacidad para centrar la imagen verticalmente mediante metodo "display table-cell" ya que nos permite no tener que especificar explicitamente pixeles como otros metodos, asi que el navegador lo maneja automaticamente y asi solo nos ocupamos de cambiar width y height desde animate() y el navegador centra automaticamente. Tenemos un width y height auto para que se ajuste automaticamente al tamaño de la imagen, pero se podria poner fijo si asi se quisiera. El metodo para centrar verticalmente con table-cell se puede ver en el "Method 1" de http://blog.themeforest.net/tutorials/vertical-centering-with-css/

• Private fiddle Extra
• Delete fiddle
Groups Extra
• jquery-mobile fixed footer with buttons layout

  jquery-mobile fixed footer with buttons layout

• Private fiddle Extra
• Delete fiddle
Groups Extra

• 1
• 2
• ▶︎
• 3