CODEWITHSUNDEEP
javascriptformsshadowbox
eaj
eaj

Reputation: 2643

Shadowbox.js hides my select inputs

I'm sure I can't be the first person to have this problem, but I haven't had any luck finding the solution.

I'm using Shadowbox in its simplest form; just doing an image popup with a link like

Click <a href="myimage.png" rel="shadowbox">here</a> to view the image.

This works fine, but has one very odd side effect: When I click the link, all of the select inputs (i.e. drop-down boxes) of the form on my page disappear. A little snooping with Firebug reveals that the CSS is being modified to give the <select> tags the property visibility: hidden. When the image is dismissed, the inputs reappear.

Not surprisingly, this happens consistently across browsers.

Since the inputs all reappear, I could probably just leave things as they are. However, if (for example) the image can't be loaded, and the script can't display it, the inputs stay invisible. Also, it looks strange and it's driving me batty. :D

Other factors that may or may not be relevant:

Upvotes: 1

Views: 615

Answers (1)

Sajid
Sajid

Reputation: 4421

This is a semi-bug in shadowbox, most likely. The select tags are being hidden because in some versions of IE, they are rendered using windows native controls, and thus always appear "above" any other element with a z-index. This obviously is a problem for ShadowBox, so the solution is to hide them while showing the box. Shadowbox should clearly do this only for troublesome browsers, but I think they're taking a more generic approach of always hiding them.

Upvotes: 3

Related Questions