Comunidad de diseño web y desarrollo en internet online

Funciones que "funcionan a la segunda"

Citar            
MensajeEscrito el 26 Dic 2016 07:13 pm
Muy buenas.

El caso es que estoy creando una galería de imágenes.

Por un lado tengo 25 miniaturas, y cada una llama a una función para cambiar la imagen de fondo de un section con id="derecha". Esta función es:

Código :

function FondoGaleria(img){
        var fondo=document.getElementById("derecha");
        fondo.style.backgroundImage="url("+img+")";
    }


Hasta aquí perfecto.

Ahora bien, por otro lado tengo unas flechas de anterior y siguiente, a las que asocio estas funciones:

Código :

function siguiente(seccion){
        var actual=document.getElementById('derecha').style.backgroundImage;
        var i=1;
        for (i=1;i<26;i++){
            var urlfondo='url("Imagenes/'+seccion+'/imagen-'+i+'.jpg")';
            if(actual==urlfondo){
                if(i<25){
                    var nueva=i+1;
                    FondoGaleria("Imagenes/"+seccion+"/imagen-"+nueva+".jpg");
                    break;
                }
                else{
                    FondoGaleria("Imagenes/"+seccion+"/imagen-1.jpg");
                    break;
                }
            }
            else{
                continue;
            }
        }
    }

    function anterior(seccion){
        var actual=document.getElementById('derecha').style.backgroundImage;
        var i=1;
        for (i=1;i<26;i++){
            var urlfondo='url("Imagenes/'+seccion+'/imagen-'+i+'.jpg")';
            if(actual==urlfondo){
                if(i>1){
                    var nueva=i-1;
                    FondoGaleria("Imagenes/"+seccion+"/imagen-"+nueva+".jpg");
                    break;
                }
                else{
                    FondoGaleria("Imagenes/"+seccion+"/imagen-25.jpg");
                    break;
                }
            }
            else{
                continue;
            }
        }
    }


Pues al arrancar la página, en mi section id="derecha" tengo una primera imagen de fondo. Las flechas no funcionan para hacer el cambio.

Si pincho en las miniaturas, cambia la imagen. Ahora voy a las flechas y funcionan. Si actualizo la página dejan de funcionar.

Una ayudita, por favor?

Por Tinillo

1 de clabLevel



Genero:Masculino  

firefox
Citar            
MensajeEscrito el 07 Ene 2017 01:06 pm
Hola amigo, podrías enseñarme el HTML ?

Tinillo escribió:

Muy buenas.

El caso es que estoy creando una galería de imágenes.

Por un lado tengo 25 miniaturas, y cada una llama a una función para cambiar la imagen de fondo de un section con id="derecha". Esta función es:

Código :

function FondoGaleria(img){
        var fondo=document.getElementById("derecha");
        fondo.style.backgroundImage="url("+img+")";
    }


Hasta aquí perfecto.

Ahora bien, por otro lado tengo unas flechas de anterior y siguiente, a las que asocio estas funciones:

Código :

function siguiente(seccion){
        var actual=document.getElementById('derecha').style.backgroundImage;
        var i=1;
        for (i=1;i<26;i++){
            var urlfondo='url("Imagenes/'+seccion+'/imagen-'+i+'.jpg")';
            if(actual==urlfondo){
                if(i<25){
                    var nueva=i+1;
                    FondoGaleria("Imagenes/"+seccion+"/imagen-"+nueva+".jpg");
                    break;
                }
                else{
                    FondoGaleria("Imagenes/"+seccion+"/imagen-1.jpg");
                    break;
                }
            }
            else{
                continue;
            }
        }
    }

    function anterior(seccion){
        var actual=document.getElementById('derecha').style.backgroundImage;
        var i=1;
        for (i=1;i<26;i++){
            var urlfondo='url("Imagenes/'+seccion+'/imagen-'+i+'.jpg")';
            if(actual==urlfondo){
                if(i>1){
                    var nueva=i-1;
                    FondoGaleria("Imagenes/"+seccion+"/imagen-"+nueva+".jpg");
                    break;
                }
                else{
                    FondoGaleria("Imagenes/"+seccion+"/imagen-25.jpg");
                    break;
                }
            }
            else{
                continue;
            }
        }
    }


Pues al arrancar la página, en mi section id="derecha" tengo una primera imagen de fondo. Las flechas no funcionan para hacer el cambio.

Si pincho en las miniaturas, cambia la imagen. Ahora voy a las flechas y funcionan. Si actualizo la página dejan de funcionar.

Una ayudita, por favor?

Por diegoburland

0 de clabLevel



 

chrome

   Página 1 de 1

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.