Jump to content

vissper

Newbie
  • Posts

    1
  • Joined

  • Last visited

Everything posted by vissper

  1. Всем привет! Я пока новичок в разработке сайтов, пишу свой первый сайт, решил прикрутить галлерею. За основу взял код отсюда: 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> Но смущает меня, то что слишком большие картинки при этом обрезаются. Каким способом можно было бы пропорционально уменьшить изображения, что бы они нормально смотрелись?
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy