Div, чтобы показать и остаться при наведении курсора мыши.

Question

Я поиграл с несколькими способами наведения курсора, но большинство из протестированных мною методов работают только тогда, когда мышь наводит курсор на ссылку.

То, чего я хочу добиться, - это divпоявляется при наведении курсора на другой div, но остается включенным, даже когда мышь покидает кнопку div.

Примером может быть: http://www.prixtel.com/

Я не против, если это просто CSS илисмешанный с Jquery / JS.

Спасибо!

Мой образец: http://jsfiddle.net/h4rB9/1/

Answer 1

Этот сайт использует скрипт для этого эффекта.

Если вы хотите использовать JavaScript:

var myDiv = document.getElementById("myDiv");
if (document.addEventListener) {
  myDiv.addEventListener("mouseover", function () {
    // whatever it is you're doing on mouseover here
  }, false);
} else if (document.attachEvent) {
  myDiv.attachEvent("onmouseenter", function () {
    // whatever it is you're doing on mouseover here
  });
} else {
  myDiv.onmouseover = function () {
    // whatever it is you're doing on mouseover here
  }
}

JQuery:

// I prefer mouseenter to mouseover, and jQuery lets you do that as does IE with attachEvent

$("#myDiv").mouseenter(function () {
  // whatever it is you're doing on mouseover here
});

Как заметил другой автор, ключом является исключение события mouseout - использование hover автоматически включает поведение mouseout.

Answer 2

Свяжите событие, которое делает div видимым (отключение отображения: нет или что-то еще), с событием наведения мыши, используя что-то вроде jQuery .mouseover () bind .Если вы не укажете привязку .mouseout (), она не исчезнет.