Register free!

The Green Industry's Resource Center



Reply
 
Thread Tools   Display Modes
  #11  
Old 03-14-2012, 10:32 PM
greg8872 greg8872 is offline
LawnSite Senior Member
 
Join Date: Jan 2012
Location: Upper Arlington, Ohio
Posts: 275
I have 788 pixels of display in Firefox, and some of the images are 750 tall then you also have the border and the controls, it it just barely fully fitting in the window (and most people when they scroll, don't stop as soon as the minimum is scrolled, they will scroll down some past it to see that for sure where the bottom of it is located.

Attached is a 50% screen shot of my browser full screen on my laptop display (my monitor attached is 1280x1024, so it doesn't have the problem. (this is a place where stats on screen size would be good, that not only tracks screen resolution, but also the size of the actual display for the page).

-Greg
Attached Images
 
Reply With Quote
  #12  
Old 03-14-2012, 11:06 PM
tonygreek's Avatar
tonygreek tonygreek is offline
LawnSite Silver Member
 
Join Date: Aug 2004
Location: Lancaster, PA
Posts: 2,829
Quote:
Originally Posted by Lynden-Jeff View Post
Hmm, I had that issues when I had some of the images to big, but I resized them down to 1000 px width max. Im surprised you had issues on a 1600 x 900. Any recommendations on how to resolve this?
Regardless of browser and screen resolution, it will be a recurring issue. Colorbox has a couple of places you can try to force a positioning change, overriding what's currently happening (it seems to keep repositioning the next image based on your scroll location of the previous). Try making changes in the colorbox.css to set the modal window position to 50px (or whatever) and then add !important; to close it. It should look something like this:

#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:50px !important; left:0; z-index:9999; overflow:hidden;}

If that doesn't do it, you have to dig into the colorbox.js to adjust the window positioning. There's a fair amount of code in there that handles this. The css method would be much easier to override the script's result, as opposed to getting the script to match what you want.
Reply With Quote
  #13  
Old 03-15-2012, 12:08 AM
Lynden-Jeff's Avatar
Lynden-Jeff Lynden-Jeff is offline
LawnSite Bronze Member
 
Join Date: Apr 2006
Location: Golden Horseshoe, Ontario
Posts: 1,547
Quote:
Originally Posted by tonygreek View Post
Regardless of browser and screen resolution, it will be a recurring issue. Colorbox has a couple of places you can try to force a positioning change, overriding what's currently happening (it seems to keep repositioning the next image based on your scroll location of the previous). Try making changes in the colorbox.css to set the modal window position to 50px (or whatever) and then add !important; to close it. It should look something like this:

#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:50px !important; left:0; z-index:9999; overflow:hidden;}

If that doesn't do it, you have to dig into the colorbox.js to adjust the window positioning. There's a fair amount of code in there that handles this. The css method would be much easier to override the script's result, as opposed to getting the script to match what you want.
Thanks Tony, made the change so if one of you guys can see if it works that would be great.
Reply With Quote
  #14  
Old 03-15-2012, 12:12 AM
Lynden-Jeff's Avatar
Lynden-Jeff Lynden-Jeff is offline
LawnSite Bronze Member
 
Join Date: Apr 2006
Location: Golden Horseshoe, Ontario
Posts: 1,547
On second look of my own the 50 PX did not seem to work. It was bumping it so you could not see the controls. I change it to a value of top:1 PX and it seems to be working. Can one of you guys verify?
Reply With Quote
  #15  
Old 03-15-2012, 02:14 AM
greg8872 greg8872 is offline
LawnSite Senior Member
 
Join Date: Jan 2012
Location: Upper Arlington, Ohio
Posts: 275
Seems like it is behaving better now, even when i make my browser window smaller.

-Greg
Reply With Quote
  #16  
Old 03-15-2012, 08:29 AM
tonygreek's Avatar
tonygreek tonygreek is offline
LawnSite Silver Member
 
Join Date: Aug 2004
Location: Lancaster, PA
Posts: 2,829
Yup, that fixed it. Glad to see it worked out. The 50px was just an example to throw a number on.

I've wrestled with Colorbox a few times, but it's rare to find a slideshow that doesn't have some presentation issue or another.

And for those of you that roll your sleeves up and dig into your own site's CSS, the " !important " tag is one of the strongest there is. When you have a script, such as Colorbox, or a site you don't have full control over the core programming of, the !important tag forces it to supersede any and all other possible styles that are trying to be set.

Tony
Reply With Quote
  #17  
Old 03-15-2012, 08:34 AM
tonygreek's Avatar
tonygreek tonygreek is offline
LawnSite Silver Member
 
Join Date: Aug 2004
Location: Lancaster, PA
Posts: 2,829
Quote:
Originally Posted by Lynden-Jeff View Post
On second look of my own the 50 PX did not seem to work. It was bumping it so you could not see the controls. I change it to a value of top:1 PX and it seems to be working. Can one of you guys verify?
You could still have it set to your originally intended 0px. I was just using the 50px as an example, with the !important tag being, well...the important bit to illustrate. Cheers.
Reply With Quote
Reply

Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump





Powered by vBulletin® Version 3.8.6
Copyright ©2000 - 2014, Jelsoft Enterprises Ltd.
Copyright ©1998 - 2012, LawnSite.comô - Moose River Media
All times are GMT -4. The time now is 10:27 AM.

Page generated in 0.08606 seconds with 10 queries