Блог

Я использую CSS3 для отображения всплывающей подсказки при наведении курсора мыши на текст:

 .tooltip {
  position:absolute; /* don't push other text out of the way */
  visibility:hidden;
}
.f:hover .tooltip {
  visibility:visible;
}
  

Это нормально, но если фрагмент текста большой, может показаться немного странным навести на него курсор в одном месте, а всплывающая подсказка появится в другом. Есть ли способ, без использования JavasScript (я знаю, что это простой способ с помощью JavaScript), чтобы элемент отображался рядом с местоположением мыши, где он впервые навел текст? Что-то вроде (концептуальный пример):

 .f:hover:before .tooltip {
  top:mouse-y;
  right:mouse-x;
}
  

Без javascript невозможно. CSS не позволит вам стилизовать элементы под курсор мыши.