The drop-down not displaying correctly when rezising the page.

[poliquinp]

When I resize the page, the sub-menu doesn't take the new "left" values.

Is it normal?

[robtarr]

Can you give an example? There is an option (appendTo) to attach the select box to another element. It's possible that if you attach it to another element, it would lose it's position relative to the original select box.

[poliquinp]

Hi,

The issue append when I give a larger size of my window then I re-open the drop-down.

But I will try what your said to me, maybe it will fix it.

EDIT (11:47 a.m) : When I place an other appendTo like this

$('.sparkbox-custom').sbCustomSelect({
appendTo: '.sparkBox'
});

I still get a huge left/top into the css.

EDIT (12:06) : When I set the appendTo to the body everything works fine execpt when I run the form, the form lose like 1px top.. Might be css issues now.

[poliquinp]

The fact is that I have two drop down using the same script.

If I place an appendTo a div position into the page, the offset.top it took with the top position of my element. So the new top is really big! Same thing happen to the offset.left.

I tried to place fixed values for top and left, but my second drop-down is taking the position of the first..

[cstickel]

Setting top and left should be optional anyways. In most cases this could be solved with css only.
.sb-custom {
position:relative;
}
.sb-custom .dropdown {
position:absolute;
top:0px;
left:0px;
}

It just makes sense if the appendTo setting is set. Maybe it should completly be removed and replaced by a callback function. Then the user would have the choice how to calculate the top and left values.

@poliquinp try the css above with top:0px !important; left:0px !important; and without appendTo setting as workaround.

EDIT:
I just noticed, that in fact left and top are just set, if appendTo setting is used. Just don't use the setting, or do you need the dropdown as bodys child for any reason? If both dropdowns should open at the same place unaffected by their selects position, you could append it to the div where you want to show them and use the css with top:0 !important; left: 0 !important; as mentioned before.

[cstickel]

@poliquinp i just commited a bugfix that should solve the problem.

The changeset can be found there:
cstickel@0bdd496

You can use the forked version, till the pull request is merged into the main repository.
https://github.com/mixer2/Custom-Selectbox/

EDIT:
Just added another changeset:
cstickel@5b8ac2f
This adds a new setting pollPosition. It helps if your selects may change their position, for another reason than resizing, while (!!!) their dropdowns are opened. For example if an element before the select is removed, added or resized. Or the margin of the select element changes, or whatever. Just don't use a to short interval (500 should be ok), because polling may lead to bad performance with short intervals. But shorter interval means higher responsiveness for updates, so also don't set it to high.