<!DOCTYPE HTML>
<html>
<head>
<link rel="stylesheet" href="css/style.css">
<style>
#block {
background: #eee;
padding: 2em;
}
.hover {
display: none;
background: green;
padding: 2em;
}
#w2 {
}
</style>
</head>
<body>
<div id="w1">
<div id="block">Сюда надо навести</div>
</div>
<div id="w2">
<div rel="block" class="hover">Текст появится</div>
</div>
<div id="w1">
<div id="block">Сюда надо навести</div>
</div>
<div id="w2">
<div rel="block" class="hover">Текст появится</div>
</div>
<script>
var bl = document.getElementById('block'),
hv = document.querySelector('.hover');
bl.onmouseover = function () {
hv.style.display = 'block';
}
hv.onmouseout = function () {
hv.style.display = 'none';
}
</script>
</body>
</html>
$( document ).ready({
$(".w1").on({
mouseenter: function () {
$(this).next().show();
},
mouseleave: function () {
$(this).next().hide();
}
})
})
Простой
Средний