Lightbox positioning problem
alexson - February 15, 2007 - 03:10
| Project: | Lightbox2 |
| Version: | 4.7.x-1.x-dev |
| Component: | Code |
| Category: | support request |
| Priority: | normal |
| Assigned: | Unassigned |
| Status: | by design |
Jump to:
Description
I've been trying to change the position of the lightbox image when activated. I get the loading and the loaded image too close to the top as everyone else using this drupal module, and am not able to find the solution to fix lightbox.css to put the image in the middle of the page, similarly done on the official project site http://www.huddletogether.com/projects/lightbox2/
Is there a way to position this box so that it would be in the middle?
#1
You can move the image further down by adding e.g. "top: 100px;" to both the #outerImageContainer{} and #imageDataContainer{} in the lightbox.css file.
This is not something I'm planning on implementing in the near future, unless this is a feature that more users request.
Cheers,
Stella
#2
Oh and you also need to add "position: relative;" to the #imageDataContainer{}
#3
Marked #141770 as a duplicate of this issue.
#4
#5
I seem to get a "double" close button in all browsers, it seemed to go away by removing
padding-top: 0.7em;from#imageData #bottomNavClose {in the css file#6
Released 5.x-2.0 and 6.x-1.0.
whoey: please try with one of the new releases. If the problem persists, please open a separate issue for it.
Cheers,
Stella
#7
Rather than messing around with the CSS, which seems not to work - the image is raised, but the menu at te botom gets stuck under an opaque box - you can modify the lightbox.js script around line 400 (try 411) in function imageLink is the line:
var lightboxTop = arrayPageScroll[1] + (arrayPageSize[3] / 10)Changing this to
var lightboxTop = arrayPageScroll[1] + (arrayPageSize[3] / 10) + 100drops everything by 100 pixels.
var lightboxTop = arrayPageScroll[1] + (arrayPageSize[3] / 10) - 100raises everything by 100 pixels.
The line below deals with the horizontal offset.
#8