galleria fotografica che da problemi con Internet Explorer

asevenx · 22 Apr 2014

Salve, ho trovato una galleria fotografica in javascript che volevo inserire su un sito, ma se apro lo script con IE la gallery non gunziona bene. La gallery in questione è la seguente http://www.html.it/demo/javascript/37606/demo_index.html (apritela con diversi browser, tra cui IE per vedere la differenza di funzionalità). A questo punto avrei bisogno di una mano per renderlo funzionale anche con IE, oppure conoscete un javascript simile (possibilmente con le mignature sotto) che sia compatibile con tutti i browser? Grazie

criric · 25 Apr 2014

Ciao, a me fa lo stesso effetto anche su IE (versione 11) comunque non è difficile da fare
prova questo esempio

HTML:

<html>
    <head>
        <title>Esempio slide</title>
        <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
        <script type="text/javascript">
            $(document).ready(function() {
                var images = ["01.jpg", "02.jpg", "03.jpg", "04.jpg", "05.jpg", "06.jpg", "07.jpg", "08.jpg"];
                var dir = "img";
                for (i in images) {
                    $(".contenitore_thumbs").append("<img src='" + dir + "/" + images[i] + "' alt='" + images[i] + "'/>");
                }
                $(".contenitore_thumbs,input[name='right'],input[name='left']").height($(".contenitore_thumbs img").height());
                $(".contenitore_thumbs").css("padding-left", "-" + $(".contenitore_thumbs img").width() * 4 + "px");
                $(".contenitore_thumbs img").click(function() {
                    $(".contenitore_immagine img").attr("src", $(this).attr("src"));
                });
                $(".contenitore_arrow input").click(function() {
                    if ($(this).attr("name") === "left") {
                        $(".contenitore_thumbs").prepend($(".contenitore_thumbs img").last().hide().show());
                    } else {
                        $(".contenitore_thumbs").append($(".contenitore_thumbs img").first().hide().show());
                    }
                });
            });
        </script>
        <style type="text/css">
            .contenitore, .contenitore_thumbs,.contenitore_immagine {
                overflow: hidden;
            }
            .contenitore {
                width: 500px;
            }
            .contenitore_thumbs img{
                width: 25%;
                float: left;
            }
            .contenitore_immagine img{
                width: 100%;
            }
            input[name="left"],input[name="right"] {
                border: none;
                cursor: pointer;
                background-color: black;
                color:white;
                font-weight: bold;
            }
            input[name="left"] {
                float: left;
            }
            input[name="right"] {
                float: right;
            }
        </style>
    </head>
    <body>
        <div class="contenitore">
            <div class="contenitore_arrow">
                <input type="button" name="left" value="<"/>
                <input type="button" name="right" value=">"/>
            </div>
            <div class="contenitore_thumbs"></div>
            <div class="contenitore_immagine">
                <img src="img/01.jpg">
            </div>
        </div>
    </body>
</html>

Sistemi il css come preferisci e il gioco è fatto

Cerca

Cerca

galleria fotografica che da problemi con Internet Explorer

asevenx

Utente Attivo

criric

Super Moderatore

Discussioni simili