अपने माता-पिता LI पर होवर करते समय लिंक होवर स्थिति को कैसे ट्रिगर करें। jQuery

Question

मैं अपने मूल ली पर होवर करते समय टेक्स्ट लिंक पर एक होवर स्टेटस ट्रिगर करने का प्रयास कर रहा हूं। क्या यह सीएसएस में संभव है और दूसरी बात, क्या मुझे कुछ ऐसा लगता है। बच्चे जो इस मुद्दे को हल करेंगे।

<li class="video-1">          
    <a href="#"><img src="images/csi-1.gif" alt="csi-1" width="140" height="80" /></a> 
    <h3 class="show-title"><a href="#">Show TItle</a></h3> 
    <h3 class="ep-name"><a href="#">Episode Name</a></h3> 
    <h4 class="season-info">Season 4 | Ep 10<span class="more"><a href="#">See More</a></span></h4> 

</li> 

और जे एस:

$(".more").hide(); 

$(".video-1").hover(function() { 
$(".video-1:hover h3.show-title a").css('color', '#006699'),function() { 
    $(this).css("color", "#fff"); 
      }  
    $(".more").toggle(); 

}); 

Answer 1

आप सिर्फ इस तरह सीएसएस के साथ हॉवर प्रभाव कर सकते हैं (अपने स्टाइलशीट में):

.video-1 .more { display: none } 
.video-1:hover h3.show-title a { color: #006699 } 
.video-1:hover .more { display: block } 

कोई जे एस पर सभी आवश्यक यहाँ एचटीएमएल है जब तक आपको IE6 का समर्थन करने की आवश्यकता नहीं है जो केवलa तत्वों का समर्थन करता है।

अद्यतन:

आप अपने HTML को कुछ इस तरह जोड़ सकता है अगर आप भी IE6 समर्थन करने की आवश्यकता:

#video-1 .more { display: none } 
#video-1:hover h3.show-title a, #video-1.hover h3.show-title a { color: #006699 } 
#video-1:hover .more, #video-1.hover .more { display: block } 

:

<!--[if lte IE 6]> 
<script type="text/javascript" charset="utf-8"> 
    jQuery(function ($) { 
    $('#video-1').hover(function() { 
     $(this).addClass('hover'); 
    }, function() { 
     $(this).removeClass('hover'); 
    }); 
    }); 
</script> 
<![endif]--> 

तो इस तरह सीएसएस समायोजित और अंत में, अपने मूल HTML को class से id पर बदलें क्योंकि आईई 6 जंजीर सीएल का समर्थन नहीं करता है सीएसएस में नामों गधा:

<li id="video-1"> 

Answer 2

.video-1:hover{color:#fff} 
.video-1 .more { display: none } 
.video-1:hover .more { display: block; z-index:10 } 

z-index पेज