вопрос
Новости отображаются картинками (по 4 новости в ряд и они близко друг к другу) при наведении мышки на новость всплывает окно с описанием. веду мышь на другую новость но окно висит поверх и получается что мышь заходит на это окошко и мешает посмотреть окошко от другой новости.
Где в ксс поправить чтобы только мышь попадает на всплывающее окно оно исчезало?
вот этот класс отвечает за окошко
А вот скрипт отвечающий за окошко ( если править скрипт)
Где в ксс поправить чтобы только мышь попадает на всплывающее окно оно исчезало?
вот этот класс отвечает за окошко
.short-item {width:22.5%; margin-right:2.5%; float:left; height:360px; position:relative;}
.short-desc {position:absolute; right:100%; top:0; z-index:150; width:300px; padding:20px; background-color:#F2F2F2; display:none;
box-shadow:5px 0 10px 0 rgba(0,0,0,0.2); border: 3px solid #f08615;}
А вот скрипт отвечающий за окошко ( если править скрипт)
if ($(window).width() > 1024) {
$('.short-item').hover(
function() {
var $winWidth = window.innerWidth;
var $movieItem = $(this);
var $moviePos = $movieItem.offset().left;
if ($moviePos < $winWidth/2) {
$movieItem.addClass('pop-right');
}
$movieItem.toggleClass('active').find('.short-desc').stop(true,true).fadeToggle(600);
});
};
Все решил вопрос добрые люди помогли.
Вот это:
Поменял на это:
Вот это:
if ($(window).width() > 1024) {
$('.short-item').hover(
function() {
var $winWidth = window.innerWidth;
var $movieItem = $(this);
var $moviePos = $movieItem.offset().left;
if ($moviePos < $winWidth/2) {
$movieItem.addClass('pop-right');
}
$movieItem.toggleClass('active').find('.short-desc').stop(true,true).fadeToggle(600);
});
};
Поменял на это:
if ($(window).width() > 1024) {
$('.short-img').hover(
function() {
var $winWidth = window.innerWidth;
var $movieItem = $(this).parent();
var $moviePos = $movieItem.offset().left;
if ($moviePos < $winWidth/2) {
$movieItem.addClass('pop-right');
}
$movieItem.toggleClass('active').find('.short-desc').stop(true,true).fadeToggle(300);
});
};