1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29

<!-- Resize the thumbnails in order to adapt to the div box width  -->
<script type="text/javascript">
// pGap=Space between the images
// pFrame=padding left+right+border
function setimagesize(pGap, pFrame) {    
    //var DivWidth=document.getElementById("vlightbox").offsetWidth;
    var DivWidth=document.getElementById("vlightbox").clientWidth;
    var fracPart = DivWidth % 150;
 
    // Calc
    var intPart = Math.floor(DivWidth / 150);
    var ImgWidth = Math.floor( DivWidth / intPart ) - (pGap + pFrame)     ; 
    var Delta=DivWidth - (ImgWidth * intPart) - ((pGap + pFrame) * intPart);   // scarto
    //alert(Delta);
    document.getElementById("vlightbox").style.paddingLeft=Delta/2 +'px';
    i=1;
    while  ( document.getElementById('myimg' + i) !=null )  {
        // alert('myimg' + i);
        if (document.getElementById('myimg' + i) !=null )  {
            document.getElementById('myimg' + i).style.width  = ImgWidth + 'px';
            document.getElementById('mylinks' + i).style.width = ImgWidth + pFrame + 'px';
            // document.getElementById("myli").style.backgroundSize="50px 50px";
        }
        i++;  
    }
}
 
</script>
 

1
2
3
4
5
6
7
8
9

<!-- When the browser window is resized or loaded... --> 
 
<script type="text/javascript"> 
 
    window.onload = function() {setimagesize(8,14);}
 
    window.onresize = function(){setimagesize(8,14);}
 
</script>