Ayuda en botón avance galería URLs
Publicado por Emma (1 intervención) el 10/01/2017 11:33:57
Hola, buenas,
Estoy empezando con JS y JQuery y justo en medio de un ejercicio que no consigo resolver...
Me gustaría compartirlo con vosotros para ver si pudiera avanzar.
En HTML consta de:
Un div que embebe diferetes URLs a modo de galería, a través de la etiqueta <object data="http://...">.
Y una flecha de avance que permitiría al usuario ver las siguientes URLs clickando sucesivamente.
JQuery consta de:
Un array con las siguientes URLs:
Y esta función para activar el avance (además de cambiar el color de la flecha):
La cuestión es que cuando haglo click en la flecha de avance voy directamente al último elemento del array, pero no consigo recorrerlo.
La función opera bien cuando sustituyo "i" por un número absoluto, pero no consigo activar el bucle ordenadamente usando "i".
Agradezco vuestra ayuda; seguro que es algo muy sencillo pero estoy empezando con programación y me estoy volviendo loca para resolverlo ;)
Un saludo y gracias
Estoy empezando con JS y JQuery y justo en medio de un ejercicio que no consigo resolver...
Me gustaría compartirlo con vosotros para ver si pudiera avanzar.
En HTML consta de:
Un div que embebe diferetes URLs a modo de galería, a través de la etiqueta <object data="http://...">.
1
<object id="content" type="text/html" data="http://www.elpais.com"> </object></div>
Y una flecha de avance que permitiría al usuario ver las siguientes URLs clickando sucesivamente.
1
<i id="siguiente-flecha" class="fa fa-arrow-right" aria-hidden="true"></i>
JQuery consta de:
Un array con las siguientes URLs:
1
2
3
4
5
6
7
8
var pages = [
'http://www.elmundo.es',
'http://www.lavanguardia.com',
'http://www.elperiodico.com',
'http://www.abc.es',
'http://www.larazon.es',
'http://www.20minutos.es',
'http://www.eldiario.es']
Y esta función para activar el avance (además de cambiar el color de la flecha):
1
2
3
4
5
6
7
$("#siguiente-flecha").on("click", function link(e) {
e.preventDefault();
$("#siguiente-flecha").css({color:"#000000", cursor:"pointer"});
for (var i = 0; i<pages.length; i++) {
if (i >=pages.length) { i=0; };
$("#content").attr({data:pages[i]});
};
La cuestión es que cuando haglo click en la flecha de avance voy directamente al último elemento del array, pero no consigo recorrerlo.
La función opera bien cuando sustituyo "i" por un número absoluto, pero no consigo activar el bucle ordenadamente usando "i".
Agradezco vuestra ayuda; seguro que es algo muy sencillo pero estoy empezando con programación y me estoy volviendo loca para resolverlo ;)
Un saludo y gracias
Valora esta pregunta
0