2010-05-20 5 views
0

Есть ли способ установить фиксированную/пользовательскую высоту для ligtbox2?Custom height in Lightbox2

#lightbox img{ width: auto; height: 600px;} 

Это только изменяет размер img, а не внешний контейнер.

ответ

0

Ни одно из этих решений не сработало, но спасибо за помощь. Я должен был получить мои руки грязные в Js ... вот мой взломан код: lightbox.js

... 
    // once image is preloaded, resize image container 


      imgPreloader.onload = (function(){ 
       var scale = 600/imgPreloader.height; //modified 
       this.lightboxImage.src = this.imageArray[this.activeImage][0]; 
       this.resizeImageContainer((imgPreloader.width * scale), //modified imgPreloader.height); 
      }).bind(this); 
      imgPreloader.src = this.imageArray[this.activeImage][0]; 
     }, 

     // 
     // resizeImageContainer() 
     // 
     resizeImageContainer: function(imgWidth, imgHeight) { 

      // get current width and height 
      var widthCurrent = this.outerImageContainer.getWidth(); 
      var heightCurrent = this.outerImageContainer.getHeight(); 

      // get new width and height 

      var widthNew = (imgWidth + LightboxOptions.borderSize * 2); 
      var heightNew = (600 + LightboxOptions.borderSize * 2); //modified 
... 
+0

теперь, если только я могу получить прототип и MooTools работать на той же странице, I» d смеяться ... lol! – Mikey1980

+0

не работает в IE8 – Jeroen

0

С этой декларацией вы стилизацией img внутри #lightbox

Попробуйте удалить img так, что вы только укладку #lightbox

делает эту работу?

#lightbox { width: auto; height: 600px;}

+0

нет кости моего друга – Mikey1980

0

Если вы идете через HTML создает вы можете увидеть, что она обернута в div с id="lightbox" и в том, что div с id="outerImageContainer". Последний имеет атрибут стиля с высотой изображения. Попробуйте настроить таргетинг. Либо переписывая его в свой CSS, либо изменяя высоту после его загрузки.

0
<html> 
<head> 
    <style type="text/css"> 
     #lightbox { border : solid 2px #000000; position:absolute; } 
     #lightbox img { width:auto; height: 600px;} 
    </style> 
</head> 
<body> 
    <div id="lightbox"> 
     <img src="Desert.jpg" alt="desert" /> 
    </div> 
</body> 
</html>