2011-01-02 3 views
1

에서 잘 작동하지 않는 그것은 여기 이미지를 통해 ... 마크가 파이어 폭스를 크롬으로 다시 돌아갑니다하지만JQuery와 slideUp 및 slideDown 크롬

스크롤 오버 슈트 http://dev.nkt-kmc-manjushri.org/

이 내가있어 코드입니다 사용.

// Set height on excerpt for smooth animation 
jQuery(".excerpt").each (function() { 
    jQuery(this).css("height", jQuery(this).height()); 
}); 

// Hide excerpts by default 
jQuery('.excerpt').hide(); 

// Fade in 
jQuery(".slide").hoverIntent({ 
    over: slidein, 
    timeout: 100, 
    out: slideout 
}); 

function slidein(){ 
    // jQuery(this).addClass('active').find('.excerpt').animate({"height":500},400); 
    jQuery('.slide').not(this).animate({opacity:0.3},400); 
    jQuery(this).addClass('active').find('.excerpt').slideDown(500);  
} 
function slideout(){ 
    // jQuery(this).find('.excerpt').animate({"height":0},400); 
    jQuery('.slide').removeClass('active').animate({opacity:1},400); 
    jQuery(this).find('.excerpt').slideUp(1500);  
} 
+0

여러분이 적용한 원소가 최소 높이를 가지면 또 다른 pb가 발생합니다! –

답변

1

.height() 메서드로 인해 문제가 발생합니까? 아마도 CSS (자바 스크립트가 아닌)를 사용하여 고정 된 높이를 설정해보십시오.

height: 18em; 

내가보기에 문제는 각 애니메이션이 발생하기 전에 여러 항목 위로 마우스를 움직이면 이상한 행동을한다는 ​​것입니다. 내가 충분히 빨리 움직인다면 나는 텍스트가 이미지로 대체 된 것을 본다.

아마도이 일을 생각해

jQuery('.slide').not(this).stop().animate({opacity:0.3},400); 

jQuery를 (이) .addClass ('활성')를 찾을 수) (정지 slideDown (500). ('발췌.').. ..

이것은 :

jQuery('.slide').stop().removeClass('active').animate({opacity:1},400); 

jQuery를 (이) .addClass ('활성'() '. 발췌')를 찾는 중지() slideDown (500).

stop()은 현재 애니메이션을 취소합니다.

.animate, .slideUp 및 .slideDown이 제공하는 콜백을 사용할 수도 있습니다.

.animate(properties, [ duration ], [ easing ], [ callback ]) 

.slideUp([ duration ], [ callback ]) 

그리고 바인딩하고 당신을 위해 애니메이션을 수행하는 일부 사용자 지정 이벤트에 바인딩을 해제하지만 아마 잔인한 : 워드 프로세서.

+0

슬프게도 처음 두 솔루션이 작동하지 않았습니다. 내가 알아낼 수 있다면 내가 마지막으로 해 볼게. 감사. – firefusion

관련 문제