{"id":1557,"date":"2013-06-15T14:04:55","date_gmt":"2013-06-15T14:04:55","guid":{"rendered":"https:\/\/www.jose-aguilar.com\/blog\/?p=1557"},"modified":"2019-04-26T10:17:22","modified_gmt":"2019-04-26T10:17:22","slug":"jquery-news-ticker","status":"publish","type":"post","link":"https:\/\/www.jose-aguilar.com\/blog\/jquery-news-ticker\/","title":{"rendered":"jQuery News Ticker"},"content":{"rendered":"

Este plugin es ideal si quieres destacar contenido en tu sitio web en formato de titular de noticias apareciendo de forma din\u00e1mica. Adem\u00e1s, tambi\u00e9n te permite mostrar las \u00faltimas noticias en formato RSS.<\/p>\n

A\u00f1adirlo a tu p\u00e1gina Web es muy sencillo. Tan solo tienes que a\u00f1adir los estilos necesarios (incluidos en la descarga), la librer\u00eda jQuery y la llamada al plugin, como en el caso del ejemplo:<\/p>\n

<link href=\"styles\/ticker-style.css\" rel=\"stylesheet\" type=\"text\/css\" \/>\r\n<script type=\"text\/javascript\" src=\"http:\/\/ajax.googleapis.com\/ajax\/libs\/jquery\/1.6.0\/jquery.min.js\"><\/script>\r\n<script src=\"includes\/jquery.ticker.js\" type=\"text\/javascript\"><\/script>\r\n<script type=\"text\/javascript\">\r\n\u00a0\u00a0\u00a0 $(function () {\r\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 $('#js-news').ticker({\r\n\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0speed: 0.10,\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 \/\/ The speed of the reveal\r\n\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0controls: true,\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 \/\/ Whether or not to show the jQuery News Ticker controls\r\n\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0titleText: '\u00daltimas noticias',\u00a0\u00a0 \/\/ To remove the title set this to an empty String\r\n\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0displayType: 'reveal', \/\/ Animation type - current options are 'reveal' or 'fade'\r\n\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0direction: 'ltr',\u00a0\u00a0\u00a0\u00a0\u00a0 \/\/ Ticker direction - current options are 'ltr' or 'rtl'\r\n\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0pauseOnItems: 2000,\u00a0\u00a0\u00a0 \/\/ The pause on a news item before being replaced\r\n\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0fadeInSpeed: 600,\u00a0\u00a0\u00a0\u00a0\u00a0 \/\/ Speed of fade in animation\r\n\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0fadeOutSpeed: 300\u00a0\u00a0\u00a0\u00a0\u00a0 \/\/ Speed of fade out animation\r\n\u00a0\u00a0 \u00a0\u00a0\u00a0 \u00a0});\r\n\u00a0\u00a0\u00a0 });\r\n<\/script><\/pre>\n
Y en el <body> de nuestra p\u00e1gina, all\u00ed donde queramos a\u00f1adimos la lista de elementos o noticias:<\/p>\n
<ul id=\"js-news\" class=\"js-hidden\">\r\n\u00a0\u00a0 \u00a0<li><a href=\"#\">This is the 1st latest news item.<\/a><\/li>\r\n\u00a0\u00a0 \u00a0<li><a href=\"#\">This is the 2nd latest news item.<\/a><\/li>\r\n\u00a0\u00a0 \u00a0<li><a href=\"#\">This is the 3rd latest news item.<\/a><\/li>\r\n\u00a0\u00a0 \u00a0<li><a href=\"#\">This is the 4th latest news item.<\/a><\/li>\r\n<\/ul><\/pre>\n
Obteniendo como resultado:<\/p>\n
\"newsticker\"<\/a><\/p>\n
Ver ejemplo en funcionamiento<\/a><\/p>\n
Ver m\u00f3dulo para prestashop<\/a><\/p>\n
Descargar plugin<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"
Este plugin es ideal si quieres destacar contenido en tu sitio web en formato de titular de noticias apareciendo de forma din\u00e1mica. Adem\u00e1s, tambi\u00e9n te permite mostrar las \u00faltimas noticias en formato RSS. A\u00f1adirlo a tu p\u00e1gina Web es muy sencillo. Tan solo tienes que a\u00f1adir los estilos necesarios (incluidos en la descarga), la librer\u00eda […]<\/p>\n","protected":false},"author":1,"featured_media":5458,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[5],"tags":[52],"class_list":["post-1557","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-jquery","tag-sliders"],"yoast_head":"\njQuery News Ticker - Jose Aguilar Blog<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"jQuery News Ticker - Jose Aguilar Blog\" \/>\n<meta property=\"og:description\" content=\"Este plugin es ideal si quieres destacar contenido en tu sitio web en formato de titular de noticias apareciendo de forma din\u00e1mica. Adem\u00e1s, tambi\u00e9n te permite mostrar las \u00faltimas noticias en formato RSS. A\u00f1adirlo a tu p\u00e1gina Web es muy sencillo. Tan solo tienes que a\u00f1adir los estilos necesarios (incluidos en la descarga), la librer\u00eda […]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.jose-aguilar.com\/blog\/jquery-news-ticker\/\" \/>\n<meta property=\"og:site_name\" content=\"Jose Aguilar Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/joseaguilarblog\" \/>\n<meta property=\"article:published_time\" content=\"2013-06-15T14:04:55+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2019-04-26T10:17:22+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2012\/12\/jquery.png\" \/>\n\t<meta property=\"og:image:width\" content=\"200\" \/>\n\t<meta property=\"og:image:height\" content=\"200\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Jose Aguilar\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@JoseAguilarBlog\" \/>\n<meta name=\"twitter:site\" content=\"@JoseAguilarBlog\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"Jose Aguilar\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/jquery-news-ticker\/\",\"url\":\"https:\/\/www.jose-aguilar.com\/blog\/jquery-news-ticker\/\",\"name\":\"jQuery News Ticker - Jose Aguilar Blog\",\"isPartOf\":{\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/jquery-news-ticker\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/jquery-news-ticker\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2012\/12\/jquery.png\",\"datePublished\":\"2013-06-15T14:04:55+00:00\",\"dateModified\":\"2019-04-26T10:17:22+00:00\",\"author\":{\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/#\/schema\/person\/e6d485db1e1140866e95971d17105d11\"},\"breadcrumb\":{\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/jquery-news-ticker\/#breadcrumb\"},\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.jose-aguilar.com\/blog\/jquery-news-ticker\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/jquery-news-ticker\/#primaryimage\",\"url\":\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2012\/12\/jquery.png\",\"contentUrl\":\"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2012\/12\/jquery.png\",\"width\":200,\"height\":200},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/jquery-news-ticker\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Portada\",\"item\":\"https:\/\/www.jose-aguilar.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"jQuery News Ticker\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/#website\",\"url\":\"https:\/\/www.jose-aguilar.com\/blog\/\",\"name\":\"Jose Aguilar Blog\",\"description\":\"Desarrollo Web con PrestaShop, WordPress, PHP, jQuery y Ajax\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.jose-aguilar.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"es\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/#\/schema\/person\/e6d485db1e1140866e95971d17105d11\",\"name\":\"Jose Aguilar\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/www.jose-aguilar.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/abbfef5f1d75260c549d0f2c2842bb697ba1aadff3b2836b39d2590c8a625415?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/abbfef5f1d75260c549d0f2c2842bb697ba1aadff3b2836b39d2590c8a625415?s=96&d=mm&r=g\",\"caption\":\"Jose Aguilar\"},\"description\":\"Director ejecutivo y tecnol\u00f3gico en JA Modules. Experto programador PrestaShop y Experto programador WordPress.\",\"sameAs\":[\"https:\/\/plus.google.com\/114357189801512615537\"],\"url\":\"https:\/\/www.jose-aguilar.com\/blog\/author\/josea902\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"jQuery News Ticker - Jose Aguilar Blog","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"og_locale":"es_ES","og_type":"article","og_title":"jQuery News Ticker - Jose Aguilar Blog","og_description":"Este plugin es ideal si quieres destacar contenido en tu sitio web en formato de titular de noticias apareciendo de forma din\u00e1mica. Adem\u00e1s, tambi\u00e9n te permite mostrar las \u00faltimas noticias en formato RSS. A\u00f1adirlo a tu p\u00e1gina Web es muy sencillo. Tan solo tienes que a\u00f1adir los estilos necesarios (incluidos en la descarga), la librer\u00eda […]","og_url":"https:\/\/www.jose-aguilar.com\/blog\/jquery-news-ticker\/","og_site_name":"Jose Aguilar Blog","article_publisher":"https:\/\/www.facebook.com\/joseaguilarblog","article_published_time":"2013-06-15T14:04:55+00:00","article_modified_time":"2019-04-26T10:17:22+00:00","og_image":[{"width":200,"height":200,"url":"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2012\/12\/jquery.png","type":"image\/png"}],"author":"Jose Aguilar","twitter_card":"summary_large_image","twitter_creator":"@JoseAguilarBlog","twitter_site":"@JoseAguilarBlog","twitter_misc":{"Escrito por":"Jose Aguilar","Tiempo de lectura":"2 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.jose-aguilar.com\/blog\/jquery-news-ticker\/","url":"https:\/\/www.jose-aguilar.com\/blog\/jquery-news-ticker\/","name":"jQuery News Ticker - Jose Aguilar Blog","isPartOf":{"@id":"https:\/\/www.jose-aguilar.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.jose-aguilar.com\/blog\/jquery-news-ticker\/#primaryimage"},"image":{"@id":"https:\/\/www.jose-aguilar.com\/blog\/jquery-news-ticker\/#primaryimage"},"thumbnailUrl":"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2012\/12\/jquery.png","datePublished":"2013-06-15T14:04:55+00:00","dateModified":"2019-04-26T10:17:22+00:00","author":{"@id":"https:\/\/www.jose-aguilar.com\/blog\/#\/schema\/person\/e6d485db1e1140866e95971d17105d11"},"breadcrumb":{"@id":"https:\/\/www.jose-aguilar.com\/blog\/jquery-news-ticker\/#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.jose-aguilar.com\/blog\/jquery-news-ticker\/"]}]},{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/www.jose-aguilar.com\/blog\/jquery-news-ticker\/#primaryimage","url":"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2012\/12\/jquery.png","contentUrl":"https:\/\/www.jose-aguilar.com\/blog\/wp-content\/uploads\/2012\/12\/jquery.png","width":200,"height":200},{"@type":"BreadcrumbList","@id":"https:\/\/www.jose-aguilar.com\/blog\/jquery-news-ticker\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Portada","item":"https:\/\/www.jose-aguilar.com\/blog\/"},{"@type":"ListItem","position":2,"name":"jQuery News Ticker"}]},{"@type":"WebSite","@id":"https:\/\/www.jose-aguilar.com\/blog\/#website","url":"https:\/\/www.jose-aguilar.com\/blog\/","name":"Jose Aguilar Blog","description":"Desarrollo Web con PrestaShop, WordPress, PHP, jQuery y Ajax","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.jose-aguilar.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"es"},{"@type":"Person","@id":"https:\/\/www.jose-aguilar.com\/blog\/#\/schema\/person\/e6d485db1e1140866e95971d17105d11","name":"Jose Aguilar","image":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/www.jose-aguilar.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/abbfef5f1d75260c549d0f2c2842bb697ba1aadff3b2836b39d2590c8a625415?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/abbfef5f1d75260c549d0f2c2842bb697ba1aadff3b2836b39d2590c8a625415?s=96&d=mm&r=g","caption":"Jose Aguilar"},"description":"Director ejecutivo y tecnol\u00f3gico en JA Modules. Experto programador PrestaShop y Experto programador WordPress.","sameAs":["https:\/\/plus.google.com\/114357189801512615537"],"url":"https:\/\/www.jose-aguilar.com\/blog\/author\/josea902\/"}]}},"_links":{"self":[{"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/posts\/1557","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/comments?post=1557"}],"version-history":[{"count":0,"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/posts\/1557\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/media\/5458"}],"wp:attachment":[{"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/media?parent=1557"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/categories?post=1557"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.jose-aguilar.com\/blog\/wp-json\/wp\/v2\/tags?post=1557"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}