jquery - How to display a span on hover over a circle? -

मैंने एक साधारण वेबसाइट बनाया है:

मेरी समस्या यह है कि जब मैं खुलने वाला span # te1 और बैंगनी span # tre1 चाहता हूँ उपयोगकर्ता छोटे सर्किलों span # punkt1 पर जाल।

मैं CSS3 या jQuery के साथ एक समाधान की तलाश कर रहा हूँ। इसके अलावा यह अच्छा होगा यदि प्रक्रिया में थोड़ी देर हो।

मेरा HTML:

  & lt; span id = "tre1" & gt; & lt; / span & gt; & Lt; span id = "te1" & gt; & lt; / span & gt; & Lt; span id = "punkt1" & gt; & lt; / span & gt;   
 मेरा सीएसएस:  
  # tre1 {स्थिति: निरपेक्ष; शीर्ष: 105 पीएक्स; बाएं: 61.5%; चौड़ाई: 0; ऊंचाई: 0; सीमा नीचे: 100px ठोस # सीसीसीसी; सीमा-सही: 150px ठोस पारदर्शी; } # टी 1 {स्थिति: पूर्ण; शीर्ष: 205px; बाएं: 61.5%; पृष्ठभूमि रंग: # 939; चौड़ाई: 150px; ऊंचाई: 150px; } # Punkt1 {स्थिति: पूर्ण; शीर्ष: 60px; बाएं: 60%; चौड़ाई: 30px; ऊंचाई: 30px; सीमा-त्रिज्या: 15px; पृष्ठभूमि रंग: # 4ec461; आप इस तरह एक अलग अवधि में # tre1 और # te1 रख सकते हैं,    
 
 
  & lt; span class = "punkt1" & gt; & Lt; span id = "tre1" & gt; & lt; / span & gt; & Lt; span id = "te1" & gt; & lt; / span & gt; & Lt; / span & gt;   
 और फिर ऐसा करें  
  $ ("# punkt1")। होवर (फ़ंक्शन () {$ ("। Punkt1")। शो (600 );}, फ़ंक्शन () {$ ("। Punkt1")। छिपाना (600);})   
  
  अपडेट करें:          
 div>