JQuery - FadeTo не работает в Chrome 16 - PullRequest
0 голосов
/ 10 октября 2011

Я выполняю очень простое затухание с помощью мыши. Вот так:

$(document).ready(function() {    
$('img#logo-link, a.advert').hover(function() {    $(this).fadeTo('fast',0.75)    } , function(){    $(this).fadeTo('fast',1)    });
});

... который отлично работает в FF7 / 8, но я не могу заставить элемент a.advert исчезать в Chrome (другие переходы работают нормально). HTML это:

<a class="advert lime" href="/my-url">
    <div class="wrapper">
        <img src="file.jpg" width="225" height="280" alt="Alt text" />
        <div class="description">
            <div class="description_content">
                <h3>Advert title</h3>
                <p>Lorem ipsum dolor sit amet</p>
            </div>
        </div>
        <div class="clear"></div>
    </div>
</a>    

Я вижу изменение непрозрачности в инспекторе Chrome, но в документе она не выглядит иначе. Другие подобные фейды работают нормально (в том числе с изображениями).

Я использую jQuery 1.6.2.

Есть мысли?

1 Ответ

0 голосов
/ 10 октября 2011

Моя первая мысль заключается в том, что это вызвано наличием элементов блочного уровня (div, images и т. Д.) Внутри встроенного элемента (a).Попробуйте добавить:

a.advert {
  display: block;
}

Однако лучший способ сделать это - избавиться от тега a и имитировать его поведение с помощью jQuery и CSS:

.wrapper:hover {
  cursor: pointer;
}

$(".wrapper").click(function() {
  window.location = '/my-url';
};

Итогда эффект наведения наверняка сработает, используя тот же код, но запустив его на $(".wrapper") вместо $("a.advert").

...