javascript - CSS: hover when focus on other element -

यदि आप निम्न सीएसएस को देखें:

  fieldset # searchform input [type = submit ]: हॉवर {पृष्ठभूमि-स्थिति: केंद्र -13 पीएक्स; } Fieldet # searchform input [type = text]: फ़ोकस फ़ील्डसेट # सर्चफार्म इनपुट [प्रकार = सबमिट करें] {पृष्ठभूमि-स्थिति: केंद्र -26 पीएक्स; } Fieldet # searchform input [type = text]: फ़ोकस फ़ील्डसेट # सर्चफार्म इनपुट [प्रकार = सबमिट करें]: हॉवर {पृष्ठभूमि-स्थिति: केंद्र -39 पीएक्स; }   
 यह विचार है कि एक बटन को पृष्ठभूमि में बदल दिया जा सकता है और पृष्ठभूमि को बदल दिया जा सकता है, लेकिन यदि इनपुट फ़ील्ड में उपयोगकर्ता फोकस होता है तो बटन पर एक भिन्न पृष्ठभूमि होनी चाहिए, हालांकि यह काम नहीं करता क्योंकि सीएसएस इसका समर्थन नहीं करता है! में इससे कैसे चला सकता हूँ? JQuery शायद?  
  संपादित करें: मैं कई परिभाषाएं करने की कोशिश नहीं कर रहा हूं!    
 
 
 हाँ, यह निश्चित रूप से नहीं है कि सीएसएस कैसे काम करता है, इसलिए आपको जेएस का इस्तेमाल करना होगा। इस तरह से कुछ प्रयास करें:  
  जेनेरिक जेएस :  
  $ ("fieldet # searchform: text")। फ़ोकस (फ़ंक्शन () {$ AddClass ("focus");}) .ब्लूर (फ़ंक्शन () {$ ("fieldet # searchform: submit")। RemoveClass ("फ़ोकस");});   
  जेनेरिक सीएसएस :  
  fieldet # searchform input [type = submit]: होवर {पृष्ठभूमि-स्थिति: 50% - 13px; } Fieldset # searchform input [type = submit]। फ़ोकस {पृष्ठभूमि-स्थिति: 50% -26px; } Fieldet # searchform input [type = submit]। फ़ोकस: हॉवर {पृष्ठभूमि-स्थिति: 50% -39 पीएक्स; }   
 
  डेमो: