vissper

Всем привет! Я пока новичок в разработке сайтов, пишу свой первый сайт, решил прикрутить галлерею. За основу взял код отсюда: http://www.artlebedev.ru/tools/technogrette/js/filmstrip/ style type="text/css"> #fsClipper { height: 330px; width: 100%; overflow: auto; //overflow: hidden; //overflow-x: auto; } .fsControl, #fsLinks a { color: darkblue; cursor: pointer; //cursor: hand; } .fsControl.disabled, #fsLinks a.current { color: #000000; cursor: default; text-decoration: none; } .fsControl.disabled { color: #666666; } #fsScreen { height: 300px ! important; background: no-repeat 50% 50%; } </style> <div id="fsClipper"> <div id="fsScreen"></div> </div> <p> <span id="fsControl_prev" class="fsControl">←</span> <span id="fsControl_next" class="fsControl">→</span> </p> <p id="fsLinks"> <a href="/portfolio/illustrations/i/0ca1b1284e6e6b78.jpg" onclick="return Show_picture( '/portfolio/illustrations/i/0ca1b1284e6e6b78.jpg', 200, 200 )">он</a>, <a href="/portfolio/illustrations/i/577698ac49499acc.jpg" onclick="return Show_picture( '/portfolio/illustrations/i/577698ac49499acc.jpg', 200, 200 )">они</a>, <a href="/portfolio/illustrations/i/69d02a844a673326.jpg" onclick="return Show_picture( '/portfolio/illustrations/i/69d02a844a673326.jpg', 200, 200 )">она</a>, <a href="/portfolio/illustrations/i/69fbeb22269a853d.jpg" onclick="return Show_picture( '/portfolio/illustrations/i/69fbeb22269a853d.jpg', 200, 200 )">оно</a> </p> <script type="text/javascript"> function Filmstrip(){ this.ePicture = document.getElementById('fsScreen'); this.ePrev = document.getElementById('fsControl_prev'); this.eNext = document.getElementById('fsControl_next'); var eLinks = document.getElementById('fsLinks'); this.aeLink = eLinks.getElementsByTagName('A'); this.show_picture = function( sBackground, iWidth, iHeight ){ this.ePicture.style.backgroundImage = "url(" + sBackground + ")"; if( iWidth ) this.ePicture.style.width = iWidth; if( iHeight ) this.ePicture.style.height = iHeight; this.set_current( sBackground ); } this.set_current = function( sHref ){ for( var i = 0; i < this.aeLink.length; i++ ){ if( this.aeLink[i].href.match( new RegExp( sHref + "$" ) ) ){ this.aeLink[i].className += " current"; this.ePrev.className = this.ePrev.className.replace( /s+disabled/g, "" ); this.eNext.className = this.eNext.className.replace( /s+disabled/g, "" ); if( i == 0 ){ this.ePrev.className += " disabled"; this.ePrev.onclick = function(){}; this.eNext.onclick = this.aeLink[i + 1].onclick; }else if( i == this.aeLink.length - 1 ){ this.eNext.className += " disabled"; this.eNext.onclick = function(){}; this.ePrev.onclick = this.aeLink[i - 1].onclick; }else{ this.eNext.onclick = this.aeLink[i + 1].onclick; this.ePrev.onclick = this.aeLink[i - 1].onclick; } }else{ this.aeLink[i].className = this.aeLink[i].className.replace( /s*current/g, "" ); } } } } var oFilmstrip = new Filmstrip(); function Show_picture( sHref, iWidth, iHeight ){ oFilmstrip.show_picture( sHref, iWidth, iHeight ); return false; } oFilmstrip.aeLink[0].onclick(); </script> Но смущает меня, то что слишком большие картинки при этом обрезаются. Каким способом можно было бы пропорционально уменьшить изображения, что бы они нормально смотрелись?