Всплывающее окно ролловера, основанное на местоположении щелчка мыши

#javascript #jquery #html #css #positioning

#javascript #jquery #HTML #css #позиционирование

Вопрос:

Мне нужно всплывающее окно с опрокидыванием, основанное на местоположении щелчка мыши (я не могу точно использовать для этого CSS с абсолютной позицией div внутри относительного, поскольку такой тип обрезает мое всплывающее окно … причина в том, что у меня есть overflow: hidden для целей макета)

Поэтому я не могу использовать это;

 <div class="wrapper">
    <ul class="popup"><li> item 1</li><li> item 2</li></ul>
    <img src="someImg.gif" width="100" height="100"/>
</div>

.wrapper {
    position: relative;
}

.popup {
    display: none;
    position: absolute;
    bottom: 105px;
    left: 10px;
}

.wrapper:hover .popup {
    display: block;
}
  

введите описание изображения здесь

Итак, могу ли я получить что-то на основе местоположения курсора мыши, и оно должно быть полностью изменяемым (без фиксированного значения «px» и должно корректироваться по мере изменения размера браузера)

Спасибо.

Ответ №1:

ну, вы на правильном пути, чтобы предотвратить обрезку всплывающего окна, дайте классу css z-индекс со значением 1000 и оболочке класса d z-индекс со значением меньше или -1