Dropdown opens in top left corner of window

[SPJohannes]

This looks like a really cool plugin but I cannot get it to work correctly.

When I click on the dropdown selector, the dropdown content is displayed in the upper left corner of the browser window and not below the drop down selector.

Has someone a clue?

• jQuery 1.7.2
• jQuery UI Selectmenu version 1.3.0pre

[fnagel]

Sounds like you're missing some CSS styles. Are you able to provide a demo
or a fiddle? See #61
Am 18.09.2012 15:50 schrieb "SPJohannes" notifications@github.com:

This looks like a really cool plugin but I cannot get it to work correctly.

When I click on the dropdown selector, the dropdown content is displayed
in the upper left corner of the browser window and not below the drop down
selector.

Has someone a clue?

• jQuery 1.7.2

• jQuery UI Selectmenu version 1.3.0pre

  —
  Reply to this email directly or view it on GitHubhttps://github.com/Dropdown opens in top left corner of window #268.

[SPJohannes]

Thank you very much for your fast reply:

Browser (incl. version): happens in Chrome, Firefox and Internet Explorer (latest versions of all)
Operating system (incl. standalone or VM): happens on Windows 7 and Mac OS X

Demo:

http://www.seoprofiler.com/x/boxtest

I have checked the CSS styles but I couldn't find the reason for this behavior.

[fnagel]

I'm will take a look asap (on vacation atm, last day)...
Am 19.09.2012 09:25 schrieb "SPJohannes" notifications@github.com:

Thank you very much for your fast reply:

Browser (incl. version): happens in Chrome, Firefox and Internet Explorer
(latest versions of all)
Operating system (incl. standalone or VM): happens on Windows 7 and Mac OS
X

Demo:

http://www.seoprofiler.com/x/boxtest

I have checked the CSS styles but I couldn't find the reason for this
behavior.

—
Reply to this email directly or view it on GitHubhttps://github.com//issues/268#issuecomment-8681782.

[SPJohannes]

It seems that the position of the dropdown is relative to the parent element, which is the body of the page in this case.

I'm not sure how to force the position of the dropdown to be relative to the select menu element.

[fnagel]

I think you are missing to include the jQuery UI position plugin.

[SPJohannes]

D'oh!

Thank you very much for your help. I have just bought you a beer. ;-)

[SPJohannes]

Is it required that the background images have the same width and height (for example 16x16)?

The second menu on http://www.seoprofiler.com/x/boxtest has background images that have 32x11 pixels. Only the left part of the images is displayed.

If I change the CSS to

.ui-selectmenu-item-icon { width:32px; }

then the image is displayed correctly but the text next to the image disappears under the image.

[fnagel]

Ahh nice, just got the PayPal message! Thanks a lot!

Mhh in latet FF both (second means right one I guess?) Selectmenus look great. Only that the left one (with the "alphabetic flags") has some missing flags, which seems to be related to missing icons.

Specific browser? Perhaps a screenshot would help to understand your problem.

[SPJohannes]

This happens in Firefox, Chrome and IE (Windows 7).

Here's a screenshot: http://i45.tinypic.com/358t1c1.jpg

Only the left side of each image is displayed. Normally, the images look like this:

http://www.seoprofiler.com/static/img/ranking-flags/en-us.png

The language box is visible, the flag is completely missing.

[fnagel]

You need to add some padding to the link (a tag) element.
I assume you will need to add a custom css class to the widget, too (to
seperate the styles for the larger image selectmenu).

Take a look at the background_image.html demo file!

[SPJohannes]

Thank you very much!

[fnagel]

Can I close this issue?

[SPJohannes]

Issue closed.