2015-05-24 52 views
0

嗨,我有容器,包含數量的框圖像。當我mouseover圖像隱藏框將出現在圖像上。但是當我使用這個腳本的所有箱子拿開...我想顯示我的內容在mouseover id #topics文章a和類名稱什麼是顯示是。topic-active

$(document).ready(function(){ 
    $('#topics article a').mouseover(function(){ 
     $('.topics-active').show() 

     }) 

    }) 

的HTML代碼

<div class=""> 
    <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12 visionbx1 padlft0px padrgt0px"><a href="#" title="ViSION"><img src="images/videoscimg.jpg" class="img-responsive"><h3 class="textarticle">entreprenuership</h3></a> 
     <div class="topics-active" style="display: block;"><a href="#" title="ViSION">  
    <h4>Inspiration</h4> 
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p> 
    <button>Follow</button> 
    </a></div> 
    </div> 

    <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12 visionbx1 padlft0px padrgt0px"><a href="#" title="ViSION"><img src="images/videoscimg.jpg" class="img-responsive"><h3 class="textarticle">entreprenuership</h3></a> 
     <div class="topics-active" style="display: block;"><a href="#" title="ViSION"> 
    <h4>Inspiration</h4> 
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p> 
    <button>Follow</button> 
    </a></div> 
    </div> 

    <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12 visionbx1 padlft0px padrgt0px"><a href="#" title="ViSION"><img src="images/videoscimg.jpg" class="img-responsive"><h3 class="textarticle">Idea</h3></a> 
    <div class="topics-active" style="display: block;"><a href="#" title="ViSION"> 
    <h4>Inspiration</h4> 
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p> 
    <button>Follow</button> 
    </a></div> 
    </div><!--end of section 1--> 
    </div>` 

回答

0

您使用類選擇$(「主題激活狀態」)。節目() ,這將顯示所有具有課程主題的元素 - 活動。

你需要使用下面的東西來選擇特定的div。在這裏,這是當前的錨點元素

$(this).prev('div[".topics-active"]').show(); 
+0

這是不工作...什麼都沒有開的時候我加入這行,而不是$(「主題激活狀態」)。展() $(文件)。就緒( function(){ \t $('#topics article a')。mouseover(function(){ \t \t $(this).prev('div [「。topics-active」]')。show(); \t \t \t \t}) \t \t}) – afzal

+0

我覺得可能在我的答案中是一個語法錯別字錯誤。嘗試$(this).prev(「div ['。topics-active']」)。show();或$(this).closest(「div ['。topics-active']」)。show(); –

相關問題