Изображение jquery rollover перемещается из позиции (jquery-hover) - PullRequest
0 голосов
/ 28 января 2011

Я - нуб-нуб и у меня проблемы с изображениями, которые остаются на месте. У меня есть функция jquery-hover, которая захватывает атрибут src изображения и заменяет его значением атрибута, называемым «over». Фактическая замена изображения работает правильно, но изображение при наведении курсора появляется примерно на 10% дальше по оси Y при каждом событии mouseenter. Я ищу полную перекрывающуюся «замену» одного изображения другим, когда изображение ролловера не появляется в другой позиции. Вот функция:

function createRollovers()
{
    var origImg ="";
    $(".swapImage").hover (
    function() {
        origImg = ($(this).attr("src"));
        $(this).attr("src", ($(this).attr("over")));
    },
    function() {
       $(this).attr("src", origImg);
    }
 );
}

HTML выглядит следующим образом:

<div id="rightSide">
    <img class="swapImage" over="images/principlesBar_hover.jpg"  src="images/principlesBar.jpg" />
    <img class="swapImage" over="images/processBar_hover.jpg"  src="images/processBar.jpg" />
    <img class="swapImage" over="images/productsBar_hover.jpg"  src="images/productsBar.jpg" />
</div>

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

Ответы [ 2 ]

0 голосов
/ 28 января 2011

Да, я согласен с Атесом. Но CSS-наведение работает только для тега привязки в некоторых браузерах, т.е. IE6 и т. Д. Если вы хотите реализовать это с помощью простого JS, вы можете проверить эту ссылку

0 голосов
/ 28 января 2011

Вам действительно не нужен JavaScript / jQuery для этого. Попробуйте псевдокласс CSS :hover, чтобы изменить фоновое изображение ваших элементов.

...