scrollbars in the script Lightbox Image Viewer

1) Script Title:
Lightbox Image viewer

2) Script URL (on DD):
http://www.dynamicdrive.com/dynamicindex4/indexb.html

3) Describe problem:
Let´s try it in English language.
I´ve added the script to my website. No problem, it works.

Nevertheless there are two problems:

First one. Scrollbars on the right hand side.
I´ve generated all sizes of images (big ones and small ones) with the script and always there are scrollbars in the area of the larger images (not in the website with the thumbnails). Why? Is there a mistake or bug in the script? Have somebody a solution for me to prevent the scrollbars?

Second problem. The script works fine with the Internet Explorer and also with the modzilla firefox. But in the browser firefox the overlay image do not work, so the larger image will be opened in front of the website without transparent background (overlay.png). What´s the mistake, what´s the solution?

I hope you understand my problems with the script in my "bad" English. Thanks for help. Thanks for the scripts and thanks to the Supervisors of the forums for their work.

mfm

To help with the first question, which version of lightbox are you using? Does the demo page do this?

The second problem is that the image path to the overlay png is incorrect in the css file. There is a filter reference there, that's good enough for IE as that is IE only but, the non-filter reference must be to the png's absolute location or its location relative to the css file.

Thanks. To the details.

To help with the first question, which version of lightbox are you using? First version, not 2.0. Does the demo page do this? no

The second problem is that the image path to the overlay png is incorrect in the css file. There is a filter reference there, that's good enough for IE as that is IE only but, the non-filter reference must be to the png's absolute location or its location relative to the css file. what is the correct path for the css file?

mfm

If the demo doesn't do this (display these scrollbars), then it is a problem with your implementation, its layout, style, or perhaps something else. A link to your page would help.

About the overlay - This line in lightbox.css:

Code:

---

#overlay{ background-image: url(overlay.png); }

---

Needs to point to the location of overlay.png. This can be either relative to the location of the lightbox.css file, or an absolute path.

Thanks for the answer.

Problem - overlay in Firefox
The overlay function works in the Internet Explorer fine, but not in the Firefox in my configuration. The path to the overlay image in css-file is of course the same, isn`t it? In my configuration it´s the same, like ../assets/script/overlay.png

But the main problem with the script are the scollbars.
It seems that the scrollbars are configured in the js-file. I´ve had a look on the file, but java is not my passion. Perhaps here in the forum there is a java specialist working with the lightbox script...

mfm

IE uses a different method for finding the overlay.png. Since it is applied as a filter, its path can be relative to the page that is using it, similar to a scripted path as, filters require javascript be enabled to work. However, the overlay.png in all other browsers is applied using pure css. In css, image files in the stylesheet must have their paths represented as relative to the stylesheet or as absolute paths.

Feel free to seek out a java specialist for your other needs.

Thanks for your explanation, jscheuer1, concerning the different path configurations in the Internet Explorer and Firefox. I will try some different paths.

About your notice: "Feel free to seek out a java specialist for your other needs." This sounds angry in your text. Sorry, if you understand me in a wrong way because of my bad English. Of course you are also a specialist ten levels better than me. But I want to respond the other specialists here in the forum to help me in my scrollbars problem. Thanks for help, jscheuer1.

Have somebody else problems with the scrollbars in the script
http://www.dynamicdrive.com/dynamicindex4/indexb.html ??

mfm

Quote:

---

Originally Posted by mfm

About your notice: "Feel free to seek out a java specialist for your other needs." This sounds angry in your text. Sorry, if you understand me in a wrong way because of my bad English.

---

I was trying to be polite about it. No, I don't think it was your use of English, which is actually pretty good. It was more your attitude that, you seem to know more about the problem than I do, that the paths had to be correct. That and the fact that you seem to be ignoring my request to post a link to your problem page. A link to your problem page is the only likely way for anyone to solve the scrollbar issue for you. If you have nowhere to put a demo of the problem online, make an archive of all the files and attach it to a post.

http://www.dynamicdrive.com/dynamici...tbox/index.htm
script: Lightbox Image Viewer

Concerning my problem with the unwanted scrollbars in the script "Lightbox Image Viewer" I´ve uploaded a test website: http://people.freenet.de/mfmayer/

Clicking the link "larger image" the script lightbox opens the larger image with a transparent background. Everything is fine, but there are the unwanted scrollbars on the right hand side. I´ve tried several different images, larger and smaller ones, but the scrollbars always will be generated.

Which details in the script, for example in the css.file or in js-file have to be modified to prevent the scrollbars?

Thanks for tips.

mfm

It would be a good idea to write valid markup:

http://validator.w3.org/check?verbos...e%2Fmfmayer%2F

It appears though that the problem only occurs in IE. And it appears as though this is only because you have partially disabled the scrollbars to begin with. It has nothing to do with the script but, it can probably be worked with. Before I get into that, using this (the absolute path):

Code:

---

#overlay{ background-image: url('http://people.freenet.de/mfmayer/assets/images/script/overlay.png'); }

---

In lightbox.css will solve the overlay problem in other browsers for your demo.

OK, the trouble with IE is that the overlay container is slightly taller than the page, this triggers the scroll bars. It would be difficult to test this but, most likely if you set its dimensions in lightbox.css like so:

Code:

---

* html #overlay{
        background-color: #333;
        height:99%!important;
        width:101%!important;
        back\ground-color: transparent;
        background-image: url(assets/images/script/blank.gif);
        filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="assets/images/script/overlay.png", sizingMethod="scale");
        }

---

That will take care of it.

Thanks jschauer1, that´s the solution!

The modification of the css-file (width: 101% and height: 99%) makes my screen free of scrollbars! Let say it with the words about the boxer Mohammed Ali: you are the greatest!

I´ll be happy finding a forum about dhtml with great scripts and specialists, who can help amateurs like me.

:)

mfm