{"id":14608,"date":"2017-10-28T06:49:39","date_gmt":"2017-10-28T10:49:39","guid":{"rendered":"http:\/\/aptgadget.com\/?p=14608"},"modified":"2017-10-28T06:49:39","modified_gmt":"2017-10-28T10:49:39","slug":"best-parallax-scrolling-plugins","status":"publish","type":"post","link":"https:\/\/aptgadget.com\/es\/best-parallax-scrolling-plugins\/","title":{"rendered":"Los mejores plugins de desplazamiento Parallax"},"content":{"rendered":"

Probablemente se haya encontrado con sitios de desplazamiento largo, ya que son muy comunes hoy en d\u00eda. Los sitios de desplazamiento de paralaje son una de las opciones m\u00e1s interesantes disponibles dentro de esta categor\u00eda de dise\u00f1o, ya que las im\u00e1genes se mueven para ofrecer un efecto de paralaje. Cuando el usuario se desplaza por la p\u00e1gina, las animaciones se suceden y, en general, el sitio web transmite una sensaci\u00f3n de frescura y exclusividad, siempre y cuando se implemente como es debido. El problema es que crear un sitio con desplazamiento de paralaje puede ser una tarea desalentadora y hay que saber mucho de Javascript, CSS y dise\u00f1o para obtener un buen resultado. Hemos preparado una lista de los mejores plugins de Parallax scrolling que te ayudar\u00e1n a crear sitios con parallax scrolling. Adem\u00e1s, cuentan con una completa librer\u00eda de efectos parallax que te permiten desarrollar p\u00e1ginas de gran aspecto de forma m\u00e1s r\u00e1pida y sencilla. Tenga en cuenta que para utilizar estos plugins, necesita tener algunos conocimientos de tecnolog\u00edas web como HTML, Javascript y CSS. Adem\u00e1s, la mayor\u00eda de las opciones enumeradas necesitan tambi\u00e9n Jquery.<\/p>\n

Alton<\/a><\/h3>\n

Se trata de un plugin jQuery de desplazamiento hacia nosotros, lo que significa que el desplazamiento nativo del navegador se desactiva para ofrecer un desplazamiento dirigido que le desplaza al siguiente punto vertical de la pantalla, una vez iniciado por la rueda del rat\u00f3n o el panel t\u00e1ctil. Alton admite tres tipos diferentes de funciones, conocidas como Est\u00e1ndar, H\u00e9roe y Fin de libro. Est\u00e1ndar le permite utilizar el desplazamiento de p\u00e1gina completa con cada secci\u00f3n de altura 100%. La secci\u00f3n siguiente o la anterior es empujada hacia arriba por el desplazamiento. H\u00e9roe le permite desplazarse s\u00f3lo por la secci\u00f3n H\u00e9roe junto con el resto de la p\u00e1gina. Bookend, como su nombre indica te da la posibilidad de crear una experiencia de estilo sujetalibros.<\/p>\n

pagePiling.js<\/a><\/h3>\n

Este es un plugin jQuery que te da la posibilidad de crear un sitio web en diferentes secciones que se apilan unas sobre otras. A medida que se desplaza, o accede a la URL, cada secci\u00f3n aparece en una animaci\u00f3n deslizante ordenada. pagePiling.js funciona con todas las plataformas incluyendo escritorio, tableta y m\u00f3vil y funciona con la mayor\u00eda de los navegadores disponibles. Incluso ofrece buenos resultados en navegadores antiguos que no soportan animaciones. Para poder utilizar pagePiling.js, necesitas a\u00f1adir un archivo CSS y un archivo Javascript dentro de tu HTML.<\/p>\n

ScrollMagic<\/a><\/h3>\n

Este es un plugin jquery popular que viene con una extensa lista de caracter\u00edsticas. Con ScrollMagic, puede crear sorprendentes efectos de desplazamiento y animaciones basadas en la posici\u00f3n de desplazamiento. Es posible mover, fijar o animar elementos HTML mientras se desplaza, durante el tiempo que desee. Adem\u00e1s, es posible a\u00f1adir efectos de paralaje a sus sitios web sin problemas. ScrollMagic soporta muchas opciones de personalizaci\u00f3n y es una soluci\u00f3n ligera. Adem\u00e1s, ofrece una gran documentaci\u00f3n y recursos.<\/p>\n

Skrollr<\/a><\/h3>\n

Esta biblioteca ligera de Javascript y CSS puros no utiliza jQuery. En esencia, es una versi\u00f3n simplificada de Scroll Magic para CSS. Para usar Skrollr, no necesitas tener conocimientos de jQuery o Javascript. Mientras sepas manejar HTML y CSS, todo ir\u00e1 bien. Skrollr utiliza atributos de datos para permitirte animar cualquier elemento HTML. Sin embargo, una de las principales desventajas es que la animaci\u00f3n s\u00f3lo funciona mientras se desplaza la p\u00e1gina, cuando no, los efectos no est\u00e1n disponibles.<\/p>\n

MultiScroll.js<\/a><\/h3>\n

Del mismo creador de pagePiling.js, multiscroll es un plugin que permite crear efectos en los que cada secci\u00f3n se carga en dos partes separadas que se deslizan a medida que se carga la p\u00e1gina. Puedes echar un vistazo a la p\u00e1gina de inicio para ver c\u00f3mo queda en el navegador. Con multiScroll.js, puedes configurar la velocidad de desplazamiento, la opci\u00f3n de desplazamiento con el teclado, el easing y muchas otras opciones. Esto te permite personalizar el efecto para conseguir el resultado exacto que esperas.<\/p>\n

ScrollMe<\/a><\/h3>\n

Este plugin te permite a\u00f1adir efectos simples de scroll parallax a tu p\u00e1gina. Puede rotar, escalar, traducir y cambiar la opacidad de los elementos en los elementos de la p\u00e1gina, mientras se desplaza hacia abajo. Javascript no es necesario para usar ScrollMe y siempre que tengas conocimientos de CSS, podr\u00e1s implementarlo. Puedes a\u00f1adir la clase \"animateme\" y los atributos de datos pertinentes para animar cualquier elemento HTML. ScrollMe es la soluci\u00f3n m\u00e1s pr\u00e1ctica para a\u00f1adir efectos CSS. Es ligero y las animaciones se ejecutan sin problemas.<\/p>\n

Stellar.js<\/a><\/h3>\n

Este es un plugin jQuery que te permite a\u00f1adir efectos de parallax scrolling f\u00e1cilmente. Para utilizarlo, primero es necesario ejecutar la funci\u00f3n $.stellar(). Es posible configurar los ajustes de animaci\u00f3n para elementos individuales utilizando atributos de datos en ese elemento. Stellar tambi\u00e9n permite tener fondos de paralaje, que se reposicionan al desplazarse. Offsets es una caracter\u00edstica pr\u00e1ctica soportada por Stellar.js. Esto asegura que todos los elementos vuelvan a su posici\u00f3n original una vez que su padre desplazado encuentre el borde de la pantalla, m\u00e1s o menos tu propio desplazamiento opcional, permiti\u00e9ndote crear complejos patrones de paralaje sin complicaciones.<\/p>","protected":false},"excerpt":{"rendered":"

You probably have come across long scrolling sites since they are very common nowadays. Parallax scrolling sites are one of the most interesting options available within this design category since the images move to offer a parallax effect. When the user scrolls down the page, the animations are prompted and overall there is a cool …<\/p>","protected":false},"author":1,"featured_media":14609,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[8],"tags":[],"class_list":["post-14608","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-software"],"yoast_head":"\nBest Parallax scrolling plugins - AptGadget.com<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/aptgadget.com\/es\/best-parallax-scrolling-plugins\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Best Parallax scrolling plugins\" \/>\n<meta property=\"og:description\" content=\"You probably have come across long scrolling sites since they are very common nowadays. Parallax scrolling sites are one of the most interesting options available within this design category since the images move to offer a parallax effect. When the user scrolls down the page, the animations are prompted and overall there is a cool …\" \/>\n<meta property=\"og:url\" content=\"https:\/\/aptgadget.com\/es\/best-parallax-scrolling-plugins\/\" \/>\n<meta property=\"og:site_name\" content=\"AptGadget.com\" \/>\n<meta property=\"article:published_time\" content=\"2017-10-28T10:49:39+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/aptgadget.com\/wp-content\/uploads\/2017\/10\/scrolling-plugins.png\" \/>\n\t<meta property=\"og:image:width\" content=\"630\" \/>\n\t<meta property=\"og:image:height\" content=\"286\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"gadgeteer\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"gadgeteer\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data2\" content=\"4 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/aptgadget.com\/best-parallax-scrolling-plugins\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/aptgadget.com\/best-parallax-scrolling-plugins\/\"},\"author\":{\"name\":\"gadgeteer\",\"@id\":\"https:\/\/aptgadget.com\/#\/schema\/person\/b5ec99736bbdc994f64e1445eb6653dc\"},\"headline\":\"Best Parallax scrolling plugins\",\"datePublished\":\"2017-10-28T10:49:39+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/aptgadget.com\/best-parallax-scrolling-plugins\/\"},\"wordCount\":837,\"commentCount\":1,\"image\":{\"@id\":\"https:\/\/aptgadget.com\/best-parallax-scrolling-plugins\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/aptgadget.com\/wp-content\/uploads\/2017\/10\/scrolling-plugins.png\",\"articleSection\":[\"Software\"],\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/aptgadget.com\/best-parallax-scrolling-plugins\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/aptgadget.com\/best-parallax-scrolling-plugins\/\",\"url\":\"https:\/\/aptgadget.com\/best-parallax-scrolling-plugins\/\",\"name\":\"Best Parallax scrolling plugins - AptGadget.com\",\"isPartOf\":{\"@id\":\"https:\/\/aptgadget.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/aptgadget.com\/best-parallax-scrolling-plugins\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/aptgadget.com\/best-parallax-scrolling-plugins\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/aptgadget.com\/wp-content\/uploads\/2017\/10\/scrolling-plugins.png\",\"datePublished\":\"2017-10-28T10:49:39+00:00\",\"author\":{\"@id\":\"https:\/\/aptgadget.com\/#\/schema\/person\/b5ec99736bbdc994f64e1445eb6653dc\"},\"breadcrumb\":{\"@id\":\"https:\/\/aptgadget.com\/best-parallax-scrolling-plugins\/#breadcrumb\"},\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/aptgadget.com\/best-parallax-scrolling-plugins\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/aptgadget.com\/best-parallax-scrolling-plugins\/#primaryimage\",\"url\":\"https:\/\/aptgadget.com\/wp-content\/uploads\/2017\/10\/scrolling-plugins.png\",\"contentUrl\":\"https:\/\/aptgadget.com\/wp-content\/uploads\/2017\/10\/scrolling-plugins.png\",\"width\":630,\"height\":286},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/aptgadget.com\/best-parallax-scrolling-plugins\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/aptgadget.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Best Parallax scrolling plugins\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/aptgadget.com\/#website\",\"url\":\"https:\/\/aptgadget.com\/\",\"name\":\"AptGadget.com\",\"description\":\"Technology Reviews, Products and News\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/aptgadget.com\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"es\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/aptgadget.com\/#\/schema\/person\/b5ec99736bbdc994f64e1445eb6653dc\",\"name\":\"gadgeteer\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/aptgadget.com\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/0a375a65cb3e5864af36a386923874096e1c658e4948b08b3f39feda34840eef?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/0a375a65cb3e5864af36a386923874096e1c658e4948b08b3f39feda34840eef?s=96&d=mm&r=g\",\"caption\":\"gadgeteer\"},\"url\":\"https:\/\/aptgadget.com\/es\/author\/gadgeteer\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Best Parallax scrolling plugins - AptGadget.com","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/aptgadget.com\/es\/best-parallax-scrolling-plugins\/","og_locale":"es_ES","og_type":"article","og_title":"Best Parallax scrolling plugins","og_description":"You probably have come across long scrolling sites since they are very common nowadays. Parallax scrolling sites are one of the most interesting options available within this design category since the images move to offer a parallax effect. When the user scrolls down the page, the animations are prompted and overall there is a cool …","og_url":"https:\/\/aptgadget.com\/es\/best-parallax-scrolling-plugins\/","og_site_name":"AptGadget.com","article_published_time":"2017-10-28T10:49:39+00:00","og_image":[{"width":630,"height":286,"url":"https:\/\/aptgadget.com\/wp-content\/uploads\/2017\/10\/scrolling-plugins.png","type":"image\/png"}],"author":"gadgeteer","twitter_misc":{"Escrito por":"gadgeteer","Tiempo de lectura":"4 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/aptgadget.com\/best-parallax-scrolling-plugins\/#article","isPartOf":{"@id":"https:\/\/aptgadget.com\/best-parallax-scrolling-plugins\/"},"author":{"name":"gadgeteer","@id":"https:\/\/aptgadget.com\/#\/schema\/person\/b5ec99736bbdc994f64e1445eb6653dc"},"headline":"Best Parallax scrolling plugins","datePublished":"2017-10-28T10:49:39+00:00","mainEntityOfPage":{"@id":"https:\/\/aptgadget.com\/best-parallax-scrolling-plugins\/"},"wordCount":837,"commentCount":1,"image":{"@id":"https:\/\/aptgadget.com\/best-parallax-scrolling-plugins\/#primaryimage"},"thumbnailUrl":"https:\/\/aptgadget.com\/wp-content\/uploads\/2017\/10\/scrolling-plugins.png","articleSection":["Software"],"inLanguage":"es","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/aptgadget.com\/best-parallax-scrolling-plugins\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/aptgadget.com\/best-parallax-scrolling-plugins\/","url":"https:\/\/aptgadget.com\/best-parallax-scrolling-plugins\/","name":"Best Parallax scrolling plugins - AptGadget.com","isPartOf":{"@id":"https:\/\/aptgadget.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/aptgadget.com\/best-parallax-scrolling-plugins\/#primaryimage"},"image":{"@id":"https:\/\/aptgadget.com\/best-parallax-scrolling-plugins\/#primaryimage"},"thumbnailUrl":"https:\/\/aptgadget.com\/wp-content\/uploads\/2017\/10\/scrolling-plugins.png","datePublished":"2017-10-28T10:49:39+00:00","author":{"@id":"https:\/\/aptgadget.com\/#\/schema\/person\/b5ec99736bbdc994f64e1445eb6653dc"},"breadcrumb":{"@id":"https:\/\/aptgadget.com\/best-parallax-scrolling-plugins\/#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/aptgadget.com\/best-parallax-scrolling-plugins\/"]}]},{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/aptgadget.com\/best-parallax-scrolling-plugins\/#primaryimage","url":"https:\/\/aptgadget.com\/wp-content\/uploads\/2017\/10\/scrolling-plugins.png","contentUrl":"https:\/\/aptgadget.com\/wp-content\/uploads\/2017\/10\/scrolling-plugins.png","width":630,"height":286},{"@type":"BreadcrumbList","@id":"https:\/\/aptgadget.com\/best-parallax-scrolling-plugins\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/aptgadget.com\/"},{"@type":"ListItem","position":2,"name":"Best Parallax scrolling plugins"}]},{"@type":"WebSite","@id":"https:\/\/aptgadget.com\/#website","url":"https:\/\/aptgadget.com\/","name":"AptGadget.com","description":"Technology Reviews, Products and News","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/aptgadget.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"es"},{"@type":"Person","@id":"https:\/\/aptgadget.com\/#\/schema\/person\/b5ec99736bbdc994f64e1445eb6653dc","name":"gadgeteer","image":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/aptgadget.com\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/0a375a65cb3e5864af36a386923874096e1c658e4948b08b3f39feda34840eef?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/0a375a65cb3e5864af36a386923874096e1c658e4948b08b3f39feda34840eef?s=96&d=mm&r=g","caption":"gadgeteer"},"url":"https:\/\/aptgadget.com\/es\/author\/gadgeteer\/"}]}},"_links":{"self":[{"href":"https:\/\/aptgadget.com\/es\/wp-json\/wp\/v2\/posts\/14608","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/aptgadget.com\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/aptgadget.com\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/aptgadget.com\/es\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/aptgadget.com\/es\/wp-json\/wp\/v2\/comments?post=14608"}],"version-history":[{"count":1,"href":"https:\/\/aptgadget.com\/es\/wp-json\/wp\/v2\/posts\/14608\/revisions"}],"predecessor-version":[{"id":14610,"href":"https:\/\/aptgadget.com\/es\/wp-json\/wp\/v2\/posts\/14608\/revisions\/14610"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/aptgadget.com\/es\/wp-json\/wp\/v2\/media\/14609"}],"wp:attachment":[{"href":"https:\/\/aptgadget.com\/es\/wp-json\/wp\/v2\/media?parent=14608"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/aptgadget.com\/es\/wp-json\/wp\/v2\/categories?post=14608"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/aptgadget.com\/es\/wp-json\/wp\/v2\/tags?post=14608"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}