किसी अन्य

पर होवर करते समय एक तत्व को कैसे बदला जाए, मैंने कई अन्य प्रश्नों को देखा है, लेकिन मुझे लगता है कि उनमें से कोई भी नहीं दिख रहा है, इसलिए मेरी समस्या है, मैं एक div या span करना चाहता हूं, जब आप होवर करते हैं इसके ऊपर एक क्षेत्र दिखाई देगा और एक बूंद की तरह होगा।किसी अन्य

इस तरह के रूप में मैं एक div है, और मुझे उस पर होवर करेंगे चाहते हैं और यह आइटम मैं hovered के बारे में कुछ जानकारी दिखाने लेकिन

<html> 
<head> 
<title>Question1</title> 

<styles type="css/text"> 

#cheetah { 
    background-color: red; 
    color: yellow; 
    text-align: center; 
} 

a { 
    color: blue; 
} 

#hidden { 
    background-color: black; 
} 

a:hover > #hidden { 
    background-color: orange; 
    color: orange; 
} 
</styles> 

</head> 
<body> 
<div id="cheetah"> 
    <p><a href="#">Cheetah</a></p> 
</div> 
<div id="hidden"> 
    <p>A cheetah is a land mammal that can run up 2 60mph!!!</p> 
</div> 
</body> 
</html>

पर इस^does not काम करने लगते हैं है, मैं जानता हूँ कि क्यों न। .. और यदि सीएसएस में ऐसा करने का कोई तरीका है, तो मैं जानना चाहता हूं, लेकिन मुझे कोई और सभी सुझाव चाहिए।

स्रोत

2011-12-23 Joshua Gottschalk

प्रश्न के नीचे मेरी टिप्पणियां देखें। वहाँ एक बेवकूफ भी है। यदि आपकी एचटीएमएल संरचना को चुनने का विकल्प एक विकल्प है - http://stackoverflow.com/questions/6669147/css-change-two-links-when-hovering-over-either-one-of-them – Jawad

jquery http में: //jsfiddle.net/amkrtchyan/e8wJb/ –

आप सीएसएस में इस लक्ष्य को हासिल कर सकते हैं केवल यदि छिपा div तत्व का एक बच्चा आप मँडरा के लिए उपयोग करते हैं:

http://jsfiddle.net/LgKkU/

स्रोत

2011-12-23 09:52:49 ptriek

आप एक गैर चाइल्ड तत्व सीएसएस 2 के भीतर से :hover का उपयोग कर, प्रभावित नहीं कर सकते जो सभी सामान्य ब्राउज़रों द्वारा समर्थित है।

तुम इतनी तरह CSS2.1 चयनकर्ताओं का उपयोग कर एक भाई तत्व प्रभावित कर सकते हैं,:

a:hover + .sibling { ... }

हालांकि, यह केवल प्रत्यक्ष भाई बहन के लिए काम करता है। इसका मतलब यह है कि आप इस तरह HTML हो सकता है:

<p><a href="#">Cheetah</a> <span class="sibling">Blah Blah Blah</span></p>

सूचना है कि a और span प्रत्यक्ष भाई बहन हैं। , तो आप अपने लक्षित दर्शकों के आधार तय करने के लिए अगर आप इस या नहीं उपयोग कर सकते हैं की जरूरत है http://jsfiddle.net/vUUxp/

हालांकि, not all browsers support the CSS2.1 sibling selectors:

यहाँ काम कर रहे भाई-बहन को दर्शाने वाला एक बेला है।

संपादित करें: + चयनकर्ता के लिए सीएसएस संस्करण पर मेरी गलती को ठीक किया गया: यह 2.1 है जो इसे परिभाषित करता है, CSS3 नहीं। मैंने ब्राउज़र समर्थन दिखाने वाला एक लिंक भी जोड़ा। अन्यथा, जवाब वही है।

स्रोत

2011-12-23 09:55:54 OverZealous

[सामान्य भाई चयनकर्ता] भी हैं (https://developer.mozilla.org/en-US/docs/Web/CSS/General_sibling_selectors), लेकिन वे केवल बाद के लिए भी काम करते हैं तत्वों – spelufo

या, यदि आप इसके लिए खुले हैं, तो jQuery का उपयोग करें।

कुछ इस तरह काम करेंगे:

$("#element") // select your element (supports CSS selectors) 
    .hover(function(){ // trigger the mouseover event 
     $("#otherElement") // select the element to show (can be anywhere) 
      .show(); // show the element 
    }, function(){ // trigger the mouseout event 
     $("#otherElement") // select the same element 
      .hide(); // hide it 
    });

और एक डोम तैयार समारोह ($(function(){...}); या $(document).ready(function(){...});) में इस रैप करने के लिए याद है।

स्रोत

2011-12-23 09:56:51 Purag

किसी अन्य

उत्तर

संबंधित मुद्दे