Skip to main content
se añadieron 634 caracteres en el cuerpo
Origen Enlace
B. Pato
  • 145
  • 9

¿has comprobado los permisosNo tengo conocimientos de las imágenes? másbootstrap, no se si lo he añadido correctamente, lo único que veo que afecta la visibilidad son las clases hidden. Bootstrap Example

    <!DOCTYPE html>
    <html> 
        <head>
            <title>Titulo de la web</title>
            <style>
                #Galeria {
                  width: 100%;
                  height: 100%;
                  margin: auto;
                }
            </style>
            <meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
            <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
            <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
            <script>
                //var imgArray = ["imagen01.jpg","https://web.com/imagen02.jpg","imagen03.jpg"];
                var imgArray = ["https://upload.wikimedia.org/wikipedia/commons/thumb/1/1e/Wikipedia-logo-v2-es.svg/1200px-Wikipedia-logo-v2-es.svg.png","https://upload.wikimedia.org/wikipedia/commons/1/1f/Wikipedia_mini_globe_handheld.jpg"];
                var curIndex = 0;
                var imgDuration = 3000;
                function slideShow() {
                    document.getElementById('Galeria').src = imgArray[curIndex];
                    curIndex++;
                    if (curIndex == imgArray.length) {
                        curIndex = 0;
                    } 
                    setTimeout("slideShow()", imgDuration);
                }
                
                window.addEventListener('load',slideShow);
            </script>
        </head>
        <body><body class="container-fluid">
            <div class="col-xs-6 hidden-lg hidden-md contenedores" id="contenedorGaleria">
                <center>
                    <img class="img-responsive" id="Galeria" />
                </center>
            </div>
        </body>
    </html>

¿has comprobado los permisos de las imágenes? más no se.

    <!DOCTYPE html>
    <html> 
        <head>
            <title>Titulo de la web</title>
            <style>
                #Galeria {
                  width: 100%;
                  height: 100%;
                  margin: auto;
                }
            </style>
            <script>
                //var imgArray = ["imagen01.jpg","https://web.com/imagen02.jpg","imagen03.jpg"];
                var imgArray = ["https://upload.wikimedia.org/wikipedia/commons/thumb/1/1e/Wikipedia-logo-v2-es.svg/1200px-Wikipedia-logo-v2-es.svg.png","https://upload.wikimedia.org/wikipedia/commons/1/1f/Wikipedia_mini_globe_handheld.jpg"];
                var curIndex = 0;
                var imgDuration = 3000;
                function slideShow() {
                    document.getElementById('Galeria').src = imgArray[curIndex];
                    curIndex++;
                    if (curIndex == imgArray.length) {
                        curIndex = 0;
                    } 
                    setTimeout("slideShow()", imgDuration);
                }
                
                window.addEventListener('load',slideShow);
            </script>
        </head>
        <body>
            <div class="col-xs-6 hidden-lg hidden-md contenedores" id="contenedorGaleria">
                <center>
                    <img class="img-responsive" id="Galeria" />
                </center>
            </div>
        </body>
    </html>

No tengo conocimientos de bootstrap, no se si lo he añadido correctamente, lo único que veo que afecta la visibilidad son las clases hidden. Bootstrap Example

    <!DOCTYPE html>
    <html> 
        <head>
            <title>Titulo de la web</title>
            <style>
                #Galeria {
                  width: 100%;
                  height: 100%;
                  margin: auto;
                }
            </style>
            <meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
            <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
            <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
            <script>
                //var imgArray = ["imagen01.jpg","https://web.com/imagen02.jpg","imagen03.jpg"];
                var imgArray = ["https://upload.wikimedia.org/wikipedia/commons/thumb/1/1e/Wikipedia-logo-v2-es.svg/1200px-Wikipedia-logo-v2-es.svg.png","https://upload.wikimedia.org/wikipedia/commons/1/1f/Wikipedia_mini_globe_handheld.jpg"];
                var curIndex = 0;
                var imgDuration = 3000;
                function slideShow() {
                    document.getElementById('Galeria').src = imgArray[curIndex];
                    curIndex++;
                    if (curIndex == imgArray.length) {
                        curIndex = 0;
                    } 
                    setTimeout("slideShow()", imgDuration);
                }
                
                window.addEventListener('load',slideShow);
            </script>
        </head>
        <body class="container-fluid">
            <div class="col-xs-6 hidden-lg hidden-md contenedores" id="contenedorGaleria">
                <center>
                    <img class="img-responsive" id="Galeria" />
                </center>
            </div>
        </body>
    </html>
Origen Enlace
B. Pato
  • 145
  • 9

Acabo de probarlo en el móvil (Android 5.1.1 y firefox) y me funciona solo he tenido que declarar a mayores un array con la localización de las imagenes, la posición de inicio del array, el tiempo que se muestran y añadir un evento que lance la función despues de que este cargado el bloque de la galeria.

¿has comprobado los permisos de las imágenes? más no se.

    <!DOCTYPE html>
    <html> 
        <head>
            <title>Titulo de la web</title>
            <style>
                #Galeria {
                  width: 100%;
                  height: 100%;
                  margin: auto;
                }
            </style>
            <script>
                //var imgArray = ["imagen01.jpg","https://web.com/imagen02.jpg","imagen03.jpg"];
                var imgArray = ["https://upload.wikimedia.org/wikipedia/commons/thumb/1/1e/Wikipedia-logo-v2-es.svg/1200px-Wikipedia-logo-v2-es.svg.png","https://upload.wikimedia.org/wikipedia/commons/1/1f/Wikipedia_mini_globe_handheld.jpg"];
                var curIndex = 0;
                var imgDuration = 3000;
                function slideShow() {
                    document.getElementById('Galeria').src = imgArray[curIndex];
                    curIndex++;
                    if (curIndex == imgArray.length) {
                        curIndex = 0;
                    } 
                    setTimeout("slideShow()", imgDuration);
                }
                
                window.addEventListener('load',slideShow);
            </script>
        </head>
        <body>
            <div class="col-xs-6 hidden-lg hidden-md contenedores" id="contenedorGaleria">
                <center>
                    <img class="img-responsive" id="Galeria" />
                </center>
            </div>
        </body>
    </html>