jQuery एक वर्ग से दूसरे वर्ग में तत्वों को फीका करता है, होवर

Question

पर यह किया जा सकता है?

उदाहरण के लिए।

.class1{ 
    background-image:(whatever.jpg) 
    color: #fff; 
} 

.class2{ 
    background-image:(whatever2.jpg) 
    color: #999; 
} 

मैं जब माउस तत्व खत्म हो गया है class2 को Class1 है कि सभी तत्वों को फीका कर सकते हैं और वापस Class1 को जब माउस बाहर है?

Answer 1

आप दोनों एक ही निरपेक्ष स्थिति देते हैं, fadein() और fadeOut() का उपयोग कर इस प्रभाव पड़ेगा (onmouseover से जुड़ी और onmouseout)।

Answer 2

मुझे लगता है कि this plugin वह है जिसे आप ढूंढ रहे हैं। यह आपको कक्षाओं के बीच एनिमेट करने की अनुमति देता है। उदाहरण के लिए:

$('.class1').animateToClass('.class2', 1000); 

Answer 3

jQuery UI's extension to addClass पर एक नज़र डालें। यह एनीमेशन की संभावना देने के लिए एक अवधि पैरामीटर की अनुमति देता है।

यहाँ, मुझे लगता है कि आप इस तरह से कुछ करना चाहता हूँ:

$('.class1').hover(function(){ 
    $(this).addClass('class2', 800); 
}, function(){ 
    $(this).removeClass('class2', 800); 
}); 

जाहिर है आप इस के लिए jQuery यूआई स्थापित करने के लिए की आवश्यकता होगी।

Answer 4

मुझे लगता है कि यह आप के लिए पूरा करने में मदद की जा सकती है ....

$('.class1').mouseover(function() { 
    $(this).toggleClass('class2'); 
}); 

Answer 5

आप एक प्लगइन का उपयोग नहीं करना चाहते हैं, तो आप निम्न कर सकते हैं:

$(".class1").hover(
function() { 
    $(this).fadeOut(function() { 
     $(this).removeClass("class1").addClass("class2").fadeIn('fast'); 
    }); 
}, 
function() { 
    $(this).fadeOut(function() { 
     $(this).removeClass("class2").addClass("class1").fadeIn('fast'); 
    }); 
}); 

Answer 6

यह वह जगह है मेरा कार्यान्वयन:

 $(this).fadeOut("fast"); or $(this).hide(); 
     $(this).removeClass('css1').addClass('css2'); 
$(this).fadeIn("slow");