brauch ich ja net viel zu sagen...
hab mal zwei dummy-pics mehrfach eingebaut, damit man sieht wie es funzt..

HTML-Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>query_gallery_scratchFile</title>
<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.js"></script>
<script type="text/javascript">
/* <![CDATA[ */ 
bilder = new Array();

        bilder[0] = new Image();
        bilder[0].src = "http://forenpics.kaninchenrettung.de/230509/image042.jpg";

        bilder[1] = new Image();
        bilder[1].src = "http://forenpics.kaninchenrettung.de/230509/image016.jpg";

        bilder[2] = new Image();
        bilder[2].src = "http://forenpics.kaninchenrettung.de/230509/image042.jpg";

        bilder[3] = new Image();
        bilder[3].src = "http://forenpics.kaninchenrettung.de/230509/image016.jpg";

        bilder[4] = new Image();
        bilder[4].src = "http://forenpics.kaninchenrettung.de/230509/image042.jpg";

        bilder[5] = new Image();
        bilder[5].src = "http://forenpics.kaninchenrettung.de/230509/image016.jpg";
        
        //scriptcode für bildergalerie - Mouseover für Thumbnails
        $("#wrapperdiv").ready(function(){ 
            $("img.normalthumb").mouseover(function(){
                var picSource = $("#anzeigePic").attr("src");
                var thumbId = $(this).attr("id");
                $("#anzeigePic").attr("src", bilder[thumbId.substr(5, thumbId.length)].src);
                $(this).removeClass("normalthumb");
                $(this).addClass("hoverthumb");
            });
            
            $("img.normalthumb").mouseout(function(){
                $(this).removeClass("hoverthumb");
                $(this).addClass("normalthumb");
            });
            
            $("#anzeigePic").attr("src", bilder[0].src);
        });
/* ]]> */ 
</script>

<style type="text/css">
.hoverthumb {
    opacity:0.5;
    -moz-opacity:0.5;                           /* ff>3 */
     filter:Alpha(opacity=50, finishopacity=50); /* ie */
     height:60px;
     width:60px;
     margin-right:12px;
     margin-top:12px;
     float:left;
  }

.normalthumb{
    height:60px; 
    width:60px; 
    margin-right:12px; 
    margin-top:12px; 
    float:left;
}
</style>
</head>
<body>

<!-- WrapperDIV für Bildergalerie -->
    <div id="wrapperdiv"><noscript>
        <strong>
            <big>Aktivieren sie bitte JAVASCRIPT für volle Funktionalität der Bildergalerie</big>
        </strong>
    </noscript>
        <!-- DIV für große Anzeige -->
        <div id="showdiv">
            <img src="" id="anzeigePic" style="width:420px;" />
        </div>
        
        <!-- DIV für Thumbnails -->
        <div id="prevdiv">
            <img id="thumb0" class="normalthumb" src="http://forenpics.kaninchenrettung.de/230509/th_image042.jpg" />
            <img id="thumb1" class="normalthumb" src="http://forenpics.kaninchenrettung.de/230509/th_image016.jpg" />
            <img id="thumb2" class="normalthumb" src="http://forenpics.kaninchenrettung.de/230509/th_image042.jpg" />
            <img id="thumb3" class="normalthumb" src="http://forenpics.kaninchenrettung.de/230509/th_image016.jpg" />
            <img id="thumb4" class="normalthumb" src="http://forenpics.kaninchenrettung.de/230509/th_image042.jpg" />
            <img id="thumb5" class="normalthumb" src="http://forenpics.kaninchenrettung.de/230509/th_image016.jpg" />
            <br />
        </div> <!-- Ende DIV für Thumbnails -->
    </div> <!-- Ende vom WrapperDIV der Galerie -->
</body>
</html>
Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!