Mouseover изменение фотографии

-1

Я пытаюсь сделать размытие изображения при наведении курсора мыши. Что-то вроде приближения и выключения камеры с некоторыми вещами становится размытым, когда другой объект увеличен. Лучший способ понять, что я хочу, - увидеть его здесь: http://berger.co.rs/test/test.html Mouseover изменение фотографии

И у меня есть только одна проблема. Навигационное изображение всегда находится за активным изображением. Мне нужно иметь только активное изображение и при наведении указателя мыши, чтобы изменить изображения. Кроме того, я не хочу, чтобы активное изображение полностью исчезло, а затем загрузило изображение с помощью мыши. Мне нужно это, как на примере выше, просто чтобы не отображалось изображение с мышью сзади.

Вы можете увидеть весь код, который у меня есть внутри источника страницы.

Не могли бы вы помочь мне?

источник

2015-07-10 vlada

пожалуйста переформулирует ... Ваш вопрос очень запутанный –

Пожалуйста, обратите внимание на примере сайте. Есть два изображения один поверх другого. Мне просто нужно, чтобы изображение 1 (активное изображение) исчезло, а изображение 2 исчезло на месте изображения. 1. Текущая ситуация: изображение 2 находится за изображением 1, а изображение с наложением мыши 1 исчезает, а изображение 2 просто остается там. На mouseOut изображение 1 снова исчезает, но изображение 2 вообще не исчезает. Я хочу тот же эффект, только изображение 2, чтобы исчезнуть на мыши. – vlada

У меня есть. Все еще запутано. –

Первый Добро пожаловать Stackoverflow, как новый пользователь, пожалуйста, прочтите это руководство, так что вы можете попросить лучше и лучше и быстрее ответы:

https://stackoverflow.com/help/how-to-ask

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

Теперь ответ:

Проблема заключается в том, что только вы не предоставили Jquery для $() команды для работы. «alturl.com/bcfhv» неверен.

здесь, поставить это на файл, он работает:

<html> 
<body> 
<style> 
    div{ 
     position:relative; 
     width:714px; 
     height:420; 
     overflow:hidden; 
    } 
    span { 
     position:absolute; 
     top:0px; 
     left:-0px; 
    } 
</style> 
<div> 
    <img src="http://berger.co.rs/test/img/mouseover.png" width="714" height="421"/> 
    <span> 
     <img src="http://berger.co.rs/test/img/active.png" width="714" height="421"/> 
    </span> 
</div> 

<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script> 
<script> 
    $(document).ready(function() { 
     alert('ok') 
     $("div").hover(function() { 
      $("span").fadeIn(); 
     }, function() { 
      $("span").fadeOut(); 
     }); 
    }) 
</script> 

</body> 
</html>

Или увидеть его работу here

источник

2015-07-10 14:02:23

Благодарим вас за ответ. Этот пример все еще не работает, как я хочу. Но большое вам спасибо за ваше время. – vlada

np ... добро пожаловать –

ответ

Смежные вопросы