2011-12-14 4 views
0

전적으로 당혹 스럽습니다. 나는 이것을 가장 간단한 가능한 경우로 축소하고 W3c's validator을 통해 실행하고 나는이 작은 Fancybox 창을 여전히 얻습니다. 나는 Fancybox를 여러 번 사용했습니다. 다음과 같습니다jQuery Fancybox가 매우 작게 표시됩니다.

enter image description here

페이지가 여기에 있습니다 : http://www.ericaspindler.com/private/

코드는 다른 모든 JS을했다 및 CSS 간섭을 찾기 위해 노력에서 제거.

전체 문서는 다음 #fancy의 DIV의 원래 HTML 콘텐츠를 명확히하기위한 노력이 하나 개의 이미지로 감소했다

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<title>Erica Spindler | Author</title> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 

<script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script> 
<script type="text/javascript" src="../js/fancybox_new/jquery.fancybox-1.3.1.js"></script> 
<link rel="stylesheet" type="text/css" href="../js/fancybox_new/jquery.fancybox-1.3.1.css" media="screen" /> 

<script type="text/javascript"> 
    $(document).ready(function(){  
    $("#infolink").fancybox({}); 
    $("#infolink").click(); 
    }); 

</script> 

</head> 
<body> 

<div id="fancy" style="display:none;"> 
<div style="width:500px; height:500px"> 
<img src="../g/video_Faulkner_Society_300.jpg" width="300" height="243" alt="" /> 
</div></div> 
<a id="infolink" href="#fancy" class="infolink" style="display:none"></a> 

</body> 
</html> 

.

$(".infolink").fancybox({ 
    'scrolling'  : 'no', 
    'titleShow'  : false, 
    'overlayOpacity' : '0.7' 
    }); 

사람이 나에게 내 오류를 말할 수 :

또한 내가 함께 초기화 된 매개 변수를 제거?

답변

5

display: none은 상자 역할을하고자하는 사람의 부모 div에 설정해야합니다. #4 (inline content) in the documentation을 참조하십시오.

따라서이 같은 자식 DIV로 id="fancy" 이동 :

<div style="display:none;"> 
    <div style="width:500px; height:500px" id="fancy"> 

HERE은 예입니다.

+0

+1 작업중인 jsbin 및 문서 링크. – JesseBuesking

+0

고마워요! 오늘은 뇌가 안돼! – jerrygarciuh

-1

이것이 도움이 될지 모르겠지만 jQuery는 무엇을 잘 작성하지 못했습니다.

$(document).ready(function(){  
    $("#infolink").fancybox(); 
}); 

전혀 도움이되지 않으면 알려주세요. 계속 조사해 보겠습니다.

관련 문제