Lightbox / Webkit Issue 1717 Responses

Last post: 1 year, 10 months ago | Thread started: Mar 17, 10, 1:17 p.m.

RespondNew TopicDisable Images

• besler

  I've got a lightbox activated on a page that has roughly 8 or so images, but in Webkit browsers (Safari, Chrome), the modal window does not change with your positioning on the screen.

  Example: http://spacemanspiff.net/cleo/de…

  Scroll down to one of the last images, and you'll see that the modal window appears at the top of the page. In Firefox (and IE, surprisingly), this isn't an issue.

  Does anyone know of how to get around this?

  Mar 17, 10, 1:17 p.m. – Permalink

• besler

  Anyone?

  

  You must be logged in to add a note. Login now or register for an account.

  Cancel

  Dog-earMar 17, 10, 1:30 p.m. – Permalink

• welded

  Take a look at this (somewhat old) bug report:
  https://bugs.webkit.org/show_bug…

  It makes some sense based on what's happening. Try using jQuery with $(document).height() or something like that instead.

  • Damn just tracked that down myself and was feeling great about my leet js debugging– zray

  

  You must be logged in to add a note. Login now or register for an account.

  Cancel

  Dog-earMar 17, 10, 1:45 p.m. – Permalink

• welded

  Er, wait, not $(document).height(). I don't know why I thought that would help. Check out comment 12 from that bug report:
  https://bugs.webkit.org/show_bug…

  • This did the trick! Thanks!– besler

  

  You must be logged in to add a note. Login now or register for an account.

  Cancel

  Dog-earMar 17, 10, 1:48 p.m. – Permalink

• welded

  Perhaps: http://api.jquery.com/scrollTop/…

  

  You must be logged in to add a note. Login now or register for an account.

  Cancel

  Dog-earMar 17, 10, 1:51 p.m. – Permalink

• zray

  or just use http://jquery.com/demo/thickbox/…

  

  You must be logged in to add a note. Login now or register for an account.

  Cancel

  Dog-earMar 17, 10, 1:52 p.m. – Permalink

• besler

  If possible, I'd like to stay with the same lightbox js solution...for a few different reasons.

  

  You must be logged in to add a note. Login now or register for an account.

  Cancel

  Dog-earMar 17, 10, 2:04 p.m. – Permalink

• welded

  Out of curiosity, what reasons are those?

  • 1) Don't know JQuery like I should (yet)
    2) Don't really wanna start from scratch if possible– besler1/4

    Seems to me both of those reasons suggest you simply go with an existing lightbox. Isn't the one you have custom?– welded2/4

    It's a highly modified version of Lightbox JS2. I didn't do the initial programming on it, but I am now...– besler3/4

    Reminder. Spring break = Learning JQuery– besler4/4

  

  You must be logged in to add a note. Login now or register for an account.

  Cancel

  Dog-earMar 17, 10, 2:05 p.m. – Permalink

• zarkonite

  Switch to shadowbox?

  

  You must be logged in to add a note. Login now or register for an account.

  Cancel

  Dog-earMar 17, 10, 3:23 p.m. – Permalink

• besler

  One more question; any idea why on http://spacemanspiff.net/cleo/ha…, the anchor links don't line up properly? The left nav works fine locally, but it jumps down about two full lines when on the server. I'm guessing it's something to do with the header, just not sure what.

  Any ideas would be appreciated.

  

  You must be logged in to add a note. Login now or register for an account.

  Cancel

  Dog-earMar 17, 10, 6:32 p.m. – Permalink

• besler

  Anyone?

  

  You must be logged in to add a note. Login now or register for an account.

  Cancel

  Dog-earMar 17, 10, 6:54 p.m. – Permalink

• bigtrickagain

  i'm guessing that if you stick your anchor inside those floating nav-box divs, it will work like you want it to. give that a try?

  

  You must be logged in to add a note. Login now or register for an account.

  Cancel

  Dog-earMar 17, 10, 6:56 p.m. – Permalink

• besler

  Nope, actually made it go down even further.

  • crud.– bigtrickagain1/2

    Haha, any other ideas? I've tried removing overflow from CSS properties to no avail either.– besler2/2

  

  You must be logged in to add a note. Login now or register for an account.

  Cancel

  Dog-earMar 17, 10, 6:59 p.m. – Permalink

• besler

  Anyone else?

  

  You must be logged in to add a note. Login now or register for an account.

  Cancel

  Dog-earMar 17, 10, 7:38 p.m. – Permalink

• bigtrickagain

  i see now. using firebug, it looks like you're neglecting to close some of your <divs> - the ones that look like this:
  <div style="clear:both; margin:0 auto; width:800px;">
  lack closing </div> tags.

  you should get this:
  http://getfirebug.com/
  it will save you heaps of time!

  

  You must be logged in to add a note. Login now or register for an account.

  Cancel

  Dog-earMar 17, 10, 7:41 p.m. – Permalink

• welded

  The named anchors are working like they should. The problem is that you need to clear another 100px or so because of the fixed header. That means your anchors need this amount of space between them and the clickable links below.

  

  You must be logged in to add a note. Login now or register for an account.

  Cancel

  Dog-earMar 17, 10, 7:52 p.m. – Permalink

• besler

  No such luck. I've literally tried everything I can think of, and I've added 100px to each of the div clears.

  • Adding the 100px also screws up the spacing beneath each category.– besler

  

  You must be logged in to add a note. Login now or register for an account.

  Cancel

  Dog-earMar 17, 10, 8:20 p.m. – Permalink

• besler

  Got it! Had to add the following to the anchors:
  style="position: absolute; margin-top:-100px;"

  • good good– bigtrickagain

  

  You must be logged in to add a note. Login now or register for an account.

  Cancel

  Dog-earMar 17, 10, 8:46 p.m. – Permalink