Jquery изменить изображение на ролловере с исчезать - PullRequest
Новая
       19

Jquery изменить изображение на ролловере с исчезать

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

В настоящее время я использую приведенный ниже скрипт для изменения изображения при наведении курсора. Есть много изображений, к которым нужно применить этот эффект - каждое изображение имеет свое собственное изображение ролловера. Сценарий работает для ролловера, но не для затухания.

Я читал об использовании CSS и jquery для эффекта затухания: http://jqueryfordesigners.com/image-cross-fade-transition/

Но было бы очень сложно написать CSS для более чем 100 различных изображений! Мне просто интересно, если кто-нибудь знает, что я делаю неправильно и как заставить работать скрипт? :) 

$(function () {
$("img.rollover").hover(function () {
    this.src = this.src.replace("_off", "_on")
}, function () {
    this.src = this.src.replace("_on", "_off")
})
});


$("a img").hover(function () {
    jQuery(this).stop().fadeTo("fast", 0.5);
}, function () {
    jQuery(this).stop().fadeTo("fast", 1);
});

1 Ответ

2 голосов
/ 31 октября 2011

Вместо того, чтобы писать CSS для более чем 100 различных изображений, почему бы не использовать цикл jQuery .each, чтобы добавить CSS для вас? 

$("img.rollover").each(function() {
    this.css('background-image',this.src.replace("_off", "_on"));
});

... и затем следовать методике с одним изображениемсо страницы , на которую вы ссылались .

...