아이콘을 클릭하면 표시되는 이미지가 있습니다. 이미지 는 세로 및 가로 중앙에 있어야하며 Chrome 및 FF에서는 잘 작동하지만 어떤 이유로 IE에서는 올바른 여백 크기를 얻지 못합니다. 클릭 javascript 함수는 이미지의 CSS 형식 marginLeft을 지정하고 높이 marginTop를 절반으로, 너비를 절반으로 수정합니다 . 다음은 코드입니다.
$('.preview').click(function(){
var img = $("#<%=imgFull.ClientID%>");
img.attr("src", $(this).attr('fullImg'));
img.attr("Visible", "true");
img.load(function(){
img.css({
top: "50%",
left: "50%",
marginTop: "-" + (img.width()/2) + "px",
marginLeft: "-" + (img.height()/2) + "px"
}, false);
});
$("#overlay").show();
$("#overlayContent").show();
});
IE가가는 한 내가 놓친 것이 있습니까? 나는 그것을 위해 브라우저 지원을 교차하는 데 익숙하지 않습니다. 나의 이전 고객 기반은 엄격히 Chrome과 FF였습니다. 테스트중인 이미지는 320x240이므로 여백은
margin-top: -160px;
margin-left: -120px;
대신 그들은
margin-top: -14px;
margin-left: -15px;
http://www.w3.org/TR/html-markup/img.html#img-display
이미지는 일반적으로 기본적으로 인라인 블록으로 표시되며 line-height요소 패딩 / 여백 높이의 혼합에 추가 됩니다. display:blockcss에서 이미지를 선언하면 높이를 계산 한 요소에서 선 높이가 제거됩니다.
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다