私はjqueryの結果

Question

私のウェブサイトのバグは、ポートフォリオの一部でhttp://www.grozav.com

である、あなたはカテゴリ名（例えば光操作）を含むdiv要素を見ることができる持っているにもかかわらず、サムネイルホバー状態のアクションをキャンセルされますそれは同じアンカータグに含まれています。

Javascriptコード：

function thumbnail(param1){ 
    $('#'+param1+'-thumb img').mouseover(function() { 
     $('#'+param1+'-thumb .color').hide().stop().fadeTo(500,'1'); 
    }) 
    $('#'+param1+'-thumb img').mouseout(function() { 
     $('#'+param1+'-thumb .color').stop().fadeTo(500,'0'); 
    })     
}; 

thumbnail('dubstep'); 

サムネイルDIV構造：

<div class="thumb" id="dubstep-thumb" > 
    <a class="ajax" href="gallery/dubstep.html"> 
     <p class="work-type">PHOTOMANIPULATION</p> 
     <img src="images/thumbs/dubstep-bwthumb.jpg" alt="" width="300" height="169"/> 
     <img src="images/thumbs/dubstep-thumb.jpg" alt="" width="300" height="169" class="color"/> 
    </a> 
</div> 

CSS、それはあらゆる使用のかどう：

.thumb { 
    float:left; 
    width:300px; 
    height:169px; 
    position:relative; 
    margin-right:10px; 
    margin-top:10px; 
    overflow:hidden; 
    z-index:1; 
} 
.thumb img { 
    position:absolute; 
    width:300px;  
    height:169px; 
} 
.thumb .color { 
    display:none;  
} 
.work-type { 
    background:url('../images/transparent.png') repeat; 
    position:absolute; 
    z-index:1; 
    width:288px; 
    height:20px; 
    margin-top:141px; 
    margin-left:1px; 
} 
.work-type { 
    font-family:arial; 
    color:#a0a0a0; 
    font-size:10px; 
    text-align:right; 
    padding-top:7px; 
    padding-right:10px; 
} 

は助けを事前にありがとうございます！このように、あなたがhover()メソッドを使用して一つにmouseoverとmouseoutイベントハンドラを組み合わせることができ、また

$('#' + param1 + '-thumb')... 

：

Answer 1

に各イベントにセレクタを変更してみてください

$('#'+param1+'-thumb').hover(
    function() { 
     $('#'+param1+'-thumb .color').hide().stop().fadeTo(500,'1'); 
    }, 
    function() { 
     $('#'+param1+'-thumb .color').stop().fadeTo(500,'0'); 
    } 
) ; 

Answer 2

あなたがいますimgタグでイベントを適用し、aでは適用しません。これを次のように変更してください：

function thumbnail(param1){ 
    $('#'+param1+'-thumb a').mouseover(function() { 
     $('#'+param1+'-thumb .color').hide().stop().fadeTo(500,'1'); 
    }) 
    $('#'+param1+'-thumb a').mouseout(function() { 
     $('#'+param1+'-thumb .color').stop().fadeTo(500,'0'); 
    })     
};