2014-01-17 2 views
1
<div class="front_hover"> 
    <img class="bg_img" src="image.jpg" width="320px" height="400px"/> 
    <div class="front_roll" style="display:none;"> 
     <!-- CONTENT HERE --> 
    </div> 
</div> 

<script language="JavaScript" type="text/javascript"> 
jQuery(document).ready(function(){ 
    jQuery(".front_hover").hover(
    function() { 
     jQuery(".front_roll", this).fadeIn(200); 
    }, 
    function() { 
     jQuery(".front_roll", this).fadeOut(200); 
    }); 
}); 
</script> 

사용자가 첫 페이지의 블록을 가리킬 때 jQuery를 사용하여 콘텐츠를 표시하는 사이트가 있습니다. 지금까지 제대로 작동했으며 Chrome에서 작동이 중지되었습니다. 다른 모든 브라우저는 여전히 정상적으로 작동하는 것 같습니다.jQuery .hover Chrome에서 작동하지 않습니다.

라이브 사이트가 globalgeneration.co.uk

+1

페이지가 * jQuery 1.10.2 *를 사용하고있는 것 같습니다. 'hover' 가상 이벤트는 * jQuery 1.9 *에서 더 이상 사용되지 않습니다. 최근에 jQuery를 업그레이드 했습니까? – techfoobar

+0

호버가 작동 중입니다. 문제는 CSS 위치에 있습니다. '# content.front_content #front_top .front_roll' 규칙을'position : absolute'으로 바꾸고'top'과'left' 속성을 제거하면, 잘 작동합니다. – Martin

+0

답변 해 주셔서 감사합니다. CSS 'absolute'가이를 수정합니다. 그래도 조금 혼란스러워. 동일한 jQuery 버전과 동일한 코드를 사용하는 [the180project.org.uk] (http://www.the180project.org.uk/)을 만들었고 정상적으로 작동합니다. – andyvisiont

답변

0

답변, origi 최종 게시글 :

jQuery 호버가 실제로 올바르게 작동하고 있습니다 (요소의 페이드 인 및 페이드 아웃).

문제는 CSS 위치에 있습니다. 당신이 position: absolute을 위해 #content.front_content #front_top .front_roll 규칙을 변경하고 topleft 속성을 제거하면, 그것은

그것은 부모가 내가 $(menu).hover(funin,funout)처럼 뭔가 같은 문제가 있었다 .front_hover { position: relative; }

-1

난 당신의 코드를 테스트하고 작동 ....

입니다 그러나 대안이, 이 작동합니다 :

jQuery(".front_hover").live("hover", 

function() { 
//Do something 
}); 

또는 이런 식으로 :

$("table tr").live({ 
    mouseenter: function() { 

    }, 
    mouseleave: function() { 

    } 
}); 
0

이 경우 position: relative;을 가지고 있다고 확인 잘 작동 여기서 메뉴는 <div><ul>...이며 position:absolute을 사용합니다. 크롬에이 사업부는 (두 경우 모두 thisdiv입니다) 동안 funout의 event.target 보면

, 그것은 FF에서이 ul 것으로 밝혀졌습니다.

정확한 이유는 모르지만 $("ul", menu).hover(funin,funout)으로 설정하면 해결됩니다. 두 경우 모두 event.target은 이제 동일합니다. Chrome이 mouseleave 이벤트 대상을 처리하는 방법과 관련이있는 것처럼 보입니다 ...

HTH, JM2CW.

관련 문제