PDA

Показать полную графическую версию : [решено] LightBox, Помогите пожалуйста!


kostya25
29-07-2011, 03:13
Здравствуйте!

Помогите пожалуйста, кто знает как ограничить размер lightbox (самого контейнера в котором выводится картинка )

Надо ограничить высоту контейнера на 700px, и если в нем открывается картинка с высотой допустим 1000px, чтобы появлялась полоса прокрутки (scroll) в самом lightbox.





Возможно ли это?

За ранее Благодарю!

Sham
29-07-2011, 08:41
overflow (http://www.w3.org/TR/CSS2/visufx.html#overflow) на контейнер.

kostya25
29-07-2011, 14:33
Вот сделал.
#outerImageContainer{
border:0px solid #abaaaa;
position:relative;
overflow-y: scroll;
overflow-x: hidden;
background-color: #fff;
width: 250px;
height: 250px;
margin: 0 auto;
}

Но это не помогло, скрол появился но сам контейнер открывается во весь масштаб картинки, а мне надо как - то ограничить размер контейнера, точнее высоту его...
"width: 250px;
height: 250px;" прописал размер но он не на что не влияет(


Как это можно сделать?(...

Sham
29-07-2011, 14:51
overflow-y: scroll;
overflow-x: hidden; »
общий стандарт CSS2 допускает только overflow (к примеру overflow: auto). Добавьте !important где размеры, уточните через DOM в отладчике нужный элемент, стиль которого нужно поправить.

kostya25
29-07-2011, 15:14
Дело в том что через CSS не получается ограничить размер самого контейнера не как...
Я читал что можно как то ограничить в самом файле lightbox.js.
Но у меня не получается(
// Once image is preloaded, resize image container
imgPreloader.onload=function(){
Element.setSrc('lightboximage', elementArray[activeElement][0]);
myLightbox.resizeElementContainer(imgPreloader.width, imgPreloader.height);
imgPreloader.onload=function(){}; // Clear onLoad, IE behaves irratically with animated gifs otherwise
}
imgPreloader.src = elementArray[activeElement][0];
}
},

//
// resizeElementContainer()
//
resizeElementContainer: function(elementWidth, elementHeight) {

// Get current width and height
this.widthCurrent = Element.getWidth('outerImageContainer');
this.heightCurrent = Element.getHeight('outerImageContainer');

// Get new width and height
var widthNew = (elementWidth + (borderSize * 2));
var heightNew = (elementHeight + (borderSize * 2));

// Scalars based on change from old to new
this.xScale = ( widthNew / this.widthCurrent) * 100;
this.yScale = ( heightNew / this.heightCurrent) * 100; - если здесь меняю размер то контейнер стает меньше!
или если больше то он и на маленькой фото большой(

А мне надо как то так чтобы если фото больше 600px, то контейнер не открывался ниже чем 600.
а при фото если оно допустим 300px, то чтобы все как и есть было! просто ограничить его высоту.

Sham
29-07-2011, 16:18
в imgPreloader.onload можно пропорционально уменьшить размеры загруженной картинки (imgPreloader.width и imgPreloader.height, если больше) и в параметры resizeImageContainer уже новые размеры совать... имхо.

kostya25
29-07-2011, 17:09
Спасибо, это получилось... но как теперь сделать так, чтобы если картинка меньше ограниченного размера то оставалось все как было???


сейчас получилось так допустим картинка 768px по высоте, контейнер ограничил на 300px по высоте, открывается контейнер 300px появляется скрол и все работает. Но если вставляю картинку 100px по высоте, то контейнер все равно открывается на 300px по высоте. (((

Sham
29-07-2011, 17:24
(imgPreloader.height < 300? imgPreloader.height: 300)
вместо imgPreloader.height в параметры...

kostya25
29-07-2011, 19:14
СПАСИБО ОГРОМНОЕ!!! ПОЛУЧИЛОСЬ)... БИГ БИГ СПАСИБО!!!


Еще вопросик если можно)
Можно ли как - то сделать, если картинка загрузилась меньше ограниченного размера чтобы скрол не появлялся
(Рис.1) (http://workkot.hop.ru/1/1.html)
Как на (рис.1) пустая область скрола, чтоб его не было. Или нельзя такого сделать?

И еще почему - то когда открываю .swf файл его размер 740х600, а ограничение у меня стоит по высоте 782, то все равно появляется скрол прокрутки (Рис.2) (http://workkot.hop.ru/1/2.html) (рис.2), и менял размер swf делал меньше чем 600 высоту все равно остается скрол.
в чем может быть проблема?

Sham
29-07-2011, 21:18
чтобы скрол не появлялся »
стиль overflow: auto (или hidden/visible) на контейнер. Читайте мануал.
то все равно появляется скрол прокрутки »
Туда кроме размера входят все маргины/падинги и линии объектов внутри контейнера. Скролл появляется, если суммарный размер превышает лимит.

Sham
31-07-2011, 13:20
Этот скрипт заточен только на IMG. Чтобы открывать так же другие объекты его нужно дорабатывать, кому это интересно...




© OSzone.net 2001-2012