Проблема с укладкой окна выбора

-1

Я видел много сообщений об этом, но я не могу быстро понять это правильно.Проблема с укладкой окна выбора

Я пытаюсь создать поле выбора с пользовательским изображением. Способ, которым я его настроил, - установить opacity:0; для окна выбора, настроить div позади него фоновым изображением и использовать javascript для установки текущего выбранного значения внутри div. У меня есть работа в Firefox, Chrome и Safari, но в IE нет удачи.

Пример 1: непрозрачность = 0, нет фонового изображения для div. Событие срабатывает, но ничего не видно.

Пример 2: opacity = 0, div имеет фоновое изображение. Работает отлично в Firefox, Chrome и Safari, но не в IE.

Пример 3: непрозрачность = 1, фоновое изображение для div. Событие не срабатывает, и нормальное поведение выбора, похоже, не существует.

Пример 4: Opacity = 1, div имеет фоновое изображение. Событие не срабатывает, и нормальное поведение выбора, похоже, не существует.

Примечание: я удалил непрозрачность: 1 из примеров 3 и 4 и по-прежнему получал такое же поведение. Я также использую z-index из 50 в блоках выбора и z-индекс 0 на div, чтобы убедиться, что они отображаются за выбранным. Противоположность, похоже, не дает другого поведения.

Для записи я пробовал .click, .change, .live ("click") .live ("change") .live ("click change"), .on ("click"), .on («change») .on («click change») в моем примере # 2, насколько это необходимо проверить в 4 браузерах. Мой конечный вопрос - почему не работает пример 2, т.е. Вторичные вопросы - это то, что связано с непрозрачностью и эффектом на поле выбора? Я предполагаю что-то с появлением: у меня там нет, но я до сих пор не понимаю, почему это непрозрачность. Если вам нужно, чтобы я опубликовал акцентный код, я могу. Но вы должны быть в состоянии видеть javascript и css через тестовую страницу, которую я предоставил.

источник

2012-05-24 d.lanza38

Пример 2 отлично работает в IE 9. – WojtekT

Пример 2 также отлично подходит для меня в IE9. Однако не работает в IE8 и старше. В качестве альтернативы вы можете поместить свой выбор внутри div с фоновым изображением, как я это сделал в этой скрипке http://jsfiddle.net/thebabydino/LWJbj/ - он не будет показывать ваше изображение в IE8 или старше, но, по крайней мере, выбор будет работать. – Ana

Извините за такой ответ. Да, теперь, когда я дома и у меня установлен IE9, похоже, что пример 2 работает нормально. Спасибо за быстрый пример Ana. Кажется, что это лучший способ сделать то, что мне нужно, если их браузер поддерживает его, тогда все будет хорошо, если нет, то по умолчанию будет установлен обычный флажок. Теперь я не думаю, что могу проверить ваш ответ Ана как решение, потому что это комментарий. Если вы можете сделать сообщение, повторив то, что вы сказали в комментарии, я дам вам чек. благодаря –

Вы должны вложенность подобные

<div class="styled-dropdown-container"> 
    <select>...</select> 
</div>

Вы можете добавить слушателя click событий на .styled-dropdown-container. События будут автоматически просачиваться (всплывать) из выпадающего меню, а также имитироваться, когда пользователь фокусируется на вашем вводе вручную (т. Е. Путем перехода к нему).

источник

2012-05-24 22:07:54

Проблема с укладкой окна выбора

ответ

Смежные вопросы