Posted by TheProf on January 21, 2009 at 2:49pm
Jump to:
| Project: | Lightbox2 |
| Version: | 6.x-1.9 |
| Component: | Code |
| Category: | support request |
| Priority: | normal |
| Assigned: | Unassigned |
| Status: | active |
Issue Summary
Hello,
I hope you are well.
I have been able to successfully install and use lightbox and it is an amazing module. It adds a certain amount of style to my site right away.
I would like to know how to resize the login box and the contact forum lightboxes. They both appear and work fine, but for some reasons their sizes are off -- the login box is too large and the contact forum box is too small (causes sideways scroll-bar to appear).
What do I need to do to change these?
Thank you.
Comments
#1
Hi,
I changed dimensions via CSS - you can use firebug and/or look at the lightbox css files to work out what you need to change.
Hope this helps.
#2
Hello,
Thank you for your response.
I didn't think it was in the CSS since I thought it is suppose to dynamically change based on the content loaded within the lightbox. I am still new to CSS and Drupal -- would you be able to point me to which css file / css definition I need to change for the contact box and the login box?
Thank you
#3
Hello,
I hope everyone is well.
Just a follow-up to my previous message -- any recommendations about how to resolve this issue of resizing the contact form?
Thank you
#4
Not sure if you're still needing this but I just did it for a site I was building. Disable the lighbox login and contact form feature and attach the event handlers yourself.
stick this on the page:
Drupal.behaviors.page_init = function (context) {
//login form
$("a[@href*='/user/login'], a[@href*='?q=user/login']").each(function() {
$(this).attr({
href: this.href.replace(/user\/login?/,"user/login/lightbox2"),
rel: 'lightmodal[|width:250px; height:210px;]'
});
});
//contact form
$("a[@href*='/contact'], a[@href*='?q=contact']").each(function() {
$(this).attr({
href: this.href.replace(/contact?/,"contact/lightbox2"),
rel: 'lightmodal[|width:450px; height:450px;]'
});
});
};
Adjust the width and height for each form to your desired size.
#5
You can also edit lightbox_modal.js
#6
True, but it's usually bad form to modify a module directly since it makes updating the module trickier.
#7
Azinck, I'm sure this is a dumb question but when you say, "stick this on the page", what page is that exactly? I am trying to resize the modal login form in lightbox2 to accommodate the addition of RPX login and editing the css file doesn't work. The only place I can find the dimensions indicated in firebug is in the lightbox.js file and I don't like cats but hate to kill kittens so if you could give me a clue about where these handlers go I would be grateful.
#8
They can basically be anywhere on the page that's going to launch your lightbox. Either in inline js or in a linked script.