mjackson / mjackson/shadowbox

Shadowbox not sizing correctly in Safari 3

Open
#7 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
JavaScript
Stars
293
Forks
110
PR merge metrics
No merged PRs in 30d

Description

Hi,

I just purchased the commercial license for our site (under development) - shadowbox works great except I'm running into some trouble with Safari V3.0.4 (523.15) on Windows XP. I'm not sure how to test it on the older versions of Safari on the Mac platform, but worried that the same problem might exist. It DOES works fine on Safari 4 on the Mac.

The shadowbox does not size itself correctly - in some cases, leading to a tiny, sliver of a box. I tried to provide a test sample in the most simple circumstance - an image with minimal html. I'm using jQuery, but ran into the same issue when I tried the standalone version. Here's the test sample link:

http://www.speakinmotion.com/testing/ShadowboxTest/shadowboxtest.html

I then added 2 quick demo videos showing the issue. The strange thing was that your samples on the shadowbox-js.com page worked fine in the same browser (second video). When I added more html content to the page with the shadowbox link, the issue improved. So...

It seems like there's a problem with how shadowbox is calculating the viewport height in this browser.

Further, it seems to be a little more complicated than just providing enough page content to fill the viewport and somehow dependent on the markup / styling. Here's a sample page for our new site where I'm using shadowbox - even though the html content pretty much fills the viewport, the shadowbox size is not calculated correctly:

http://www.speakinmotion.com/testing/newsite/Solutions-iPhoneApp-Introduction.html

I have modified the shadowbox.css file for this one, but the same issue exists even if I hadn't (the test link above is unmodified).

I'm hoping you could provide some insight here, or perhaps a suggestion for an html hack that would trick the shadowbox into calculating the height correctly for Safari 3?

Thank you!

-Jeff

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Reproduce the issue using the linked ShadowboxTest page in Safari 3.0.4 on Windows XP, then compare it with the linked new-site page and the shadowbox-js.com samples. Review the unmodified shadowbox.css and test both the jQuery and standalone cases; done means the shadowbox sizes correctly without relying on extra page content.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, jquery
Domain
frontend, web-dev
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.