는 반응 사이트

Question

뉴 그러나 여기에서 날카로운 JQuery와 사용자를위한 조건 jQuery를 필요, 처음에 내가 스크롤과 행복

나는 환상적인 caroufredsel (반응 JQuery와 회전 목마)를 사용하고 있습니다 :) 부드럽게하고를 설정하십시오 기능.

기타 목록을 표시합니다. 현재 3 개 밖에 없지만 앞으로 더 추가 될 수 있도록하고 싶습니다.

응답 성있는 사이트를 구축 중이며 작은 화면 크기에서만 2 개를 표시 한 다음 한 번에 기타 1 개를 볼 수 있습니다. 문제는 전체 너비 브라우저로 시작한다는 것입니다. 작은 화면으로 크기를 조정하면 jquery가이 점을 고려하여 다시 실행되지 않습니다. 따라서 슬라이더 컨트롤이 나타나게하려면 작은 크기로 화면을 새로 고쳐야합니다.

마찬가지로 작은 화면으로 시작하면 확대 할 때 기능상 쓸모가 없더라도 모든 항목이 표시되므로 컨트롤이 화면 상에 남아 있습니다.

따라서 필요한 경우에만 (예 : 캐 러셀의 모든 콘텐츠가 한꺼번에 표시되지 않는 경우) 컨트롤을 표시하고 새로 고치지 않고 현재 화면 크기에 따라 컨트롤을 조정할 수 있습니다.

나는 이것이 회전 장치를 파괴하고 화면의 크기를 재조정 할 때 다시 시도하여 가능하다고 생각하지만 작동시키지 못한다.

이 사이트는이 주소에서 온라인 : http://www.wirebirdguitars.com/staging/guitars.html

어떤 도움/제안 진정으로 감상 할 수있다. 감사!!

Answer 1

JS에 추가하십시오.

function doSomething() { 

    $('#guitars-gallery').trigger('destroy'); 

    $("#guitars-gallery").carouFredSel({ 
    auto: false, 
    circular: false, 
    prev: '#prev', 
    next: '#next', 
    responsive : true, 
    height : 'auto', 
    items : { width : 400, visible : { min : 1, max : 3 } } }); 

}; 

var resizeTimer; 

$(window).resize(function() { 
    clearTimeout(resizeTimer); 
    resizeTimer = setTimeout(doSomething, 100); 
}); 

this question에 의해 영감을 얻은 것.