jquery 슬라이드 쇼로 새로 고침시 슬라이드 쇼 높이가 변경됨

Question

여기 재미있는 내용이 있습니다.

내 페이지가 jquery cycle plugin을 사용하여 만든 슬라이드 쇼를로드하고 있습니다. 슬라이드 쇼의 높이가 가변적이어서 각 슬라이드의 높이를 평가하고 그에 따라 슬라이드 쇼 래퍼 크기를 조정해야만했습니다 (크롬에 문제가있는 것처럼)

페이지로드시 모든 코드가 올바르게 작동합니다. 당신은 슬라이드 쇼의 상속 된 높이가 손실된다는 것을 알기 때문에 - 슬라이드 쇼 아래 페이지의 모든 텍스트가 페이지 위로 이동하고 슬라이드 쇼 뒤에서 - 첫 번째 슬라이드의 문제점 인 것처럼 보입니다. .

다음은 예제 코드입니다. (제 코드의 나머지 부분은 판단하지 마십시오. 이것은 개발 사이트 일 뿐이므로 정리가 필요하면 알 수 있습니다!) - 이미지 아래에있는 (사운드 클라우드가 포함 된) 텍스트 슬라이드 높이의 영향을받는 비트. http://www.frootful.co.uk/index-z.php/?p=7

여기에 슬라이드 쇼 작업을 코드의 사람들이 이중으로 도움이 될 것입니다 답변을 설명 할 수 그래서 만약

<script type="text/javascript">  
$(document).ready(function() { 
    $('#toggle').bind("click", function() { 
    if ($(this).attr("class") == "play") 
    $(this).attr("class", "pause"); 
    else 
    $(this).attr("class", "play"); 
}); 
var toggle = $('#toggle').click(function() { 
    var paused = slideshow.is(':paused'); 
    slideshow.cycle(paused ? 'resume' : 'pause', true); 
}); 
var slideshow = $('#slideshow').cycle({ 
     fx:  "fade", 
     pager: "#single-slideshow-nav", 
     timeout: 4000, 
     prev: "#prev", 
     next: "#next", 
      after: onAfter, 
     pause: true 
    }); 
}); 
function onAfter() { 
    //get the height of the current slide 
    var $ht = $('.slidewrap').height(); 
    //set the container's height to that of the current slide 
    $("#slideshow").height($ht); 
} 
</script> 

내 자바 스크립트가 아닌 중대하다 (너무 거기에 약간의 재생/일시 정지 기능이있다) !

감사

편집 -----------

더 나은 예제 페이지 (http://www.frootful.co.uk/index-z.php/를 추가? p = 7) 위에서 언급 한 바와 같이 아래의 텍스트 비트는 슬라이드 높이의 영향을받는 비트입니다 ...

Answer 1

(답변시) 예제 페이지에는 슬라이드가 포함되어 있지 않으며 div toggle이라고합니다.

귀하의 자바 스크립트에는 두 개의 $(document).ready 블럭이 포함되어 있습니다.이 두 블럭 모두 #toggle에 대한 클릭 핸들러를 설정하려고합니다 (존재하지 않지만). 하나의 코드 블럭에 병합 할 수는 있습니다.

paused 및 resumed 함수는 값을 반환하기위한 것이므로이 둘에 모두 return을 추가해야합니다. (즉, 이것이 의미하는 경우 return !byHover;)

그 밖의 다른 정보는 무엇입니까? 나는 당신이 attr을 통해 클래스를 조작하는 대신에 add/remove/toggleClass를 시도해 볼 수 있다고 생각하지만 차이를 만들지는 모른다.