2012-06-24 4 views
6

반응 형 caroufredsel을 사용하면 Chrome & Firefox에서 매력처럼 작동하지만 Safari에서는 갑자기 800px의 위쪽과 아래쪽 여백을 생성하여 모든 것을 던집니다.jquery가 Safari에서만 여백 문제 발생

응답 성이 뛰어난 사이트이며 이상하게도 500px 이하의 화면에 대한 미디어 쿼리의 영향을받을 때 문제가 발생하지 않습니다.

이 사이트는 모든 준비가 완료되면 도메인에 매핑되도록 서버에서 대기하는 Wordpress 사용자 정의 빌드입니다.

라이브 페이지 :

http://109.203.120.0/~wirebird/wordpress/the-guitars/ 

static html version 작품 좋은, 그래서이 워드 프레스 문제, 또는 아직 진정한 도메인을 사용하지 않는 것이 사실이다? 아래 caroufredsel 발사에 대한

JQuery와 :

jQuery(document).ready(function() { 

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

}); 

function doSomething() { 

jQuery('#guitars-gallery').trigger('destroy', true); 
jQuery('#guitars-gallery').css({'text-align': '','float': '','position': '','top': '','right': '','bottom': '','left': '','width': '90%','height': '','margin': '1% auto'}); 

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

}; 

var resizeTimer; 

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

모든 아이디어를 환영, 그것은 나를 미친 운전입니다!

업데이트 : 회전 목마가 호출 된 후 스타일을 변경 jQuery를 사용하여 지금은이 문제를 해결 한 :

jQuery('.caroufredsel_wrapper').css({'margin-top': '0px', 'margin-bottom': '0px'}); 

수정 문제,하지만 난 여전히 현명 아무도 해요 왜 일어나고에 관해서 :-)

+0

나는 jQuery의 선택자가'$'이 아니라'jQuery'라고 생각했다 ... – Bluefire

+0

스크립트 중 하나를로드 할 수 없으며 "rem"을 단위로 사용하는 곳이 많다. – SVS

+2

@Bluefire 다른 프레임 워크와의 충돌을 피하기 위해 ** $ ** 또는 ** jQuery **를 선택기로 사용할 수 있습니다. ** 기본적으로 jQuery는 "$"를 "jQuery"**의 바로 가기로 사용합니다. http://docs.jquery.com/Using_jQuery_with_Other_Libraries – insertusernamehere

답변

0

나는 당신이 어떤 충돌 스타일도 없는지 확인하기 위해 wordpress에서 당신의 테마의 스타일 시트를 점검 할 것이다.

.wrapper이 아닌 항상 .caroufredsel_wrapper으로 전화 했습니까?