클릭 한 경우 확대 할 작은 그림이 있습니다. 17 "노트북 화면을 사용할 때 확대 기능이 작동하지만 축소 된 그림은 완전히 나타나지 않습니다. '이 같은 문제의 Mac에서 사용되는 다른 크기 screen.when을 사용하고 있습니다.그림 확대 문제
은 모든 다른 크기의 창에서 동일하게 보이게 할 수있는 방법이 있다면 난 그냥 궁금 해서요.
이당신이 볼 수 있습니다 작은 그림을 클릭 한 다음 왼쪽의 큰 그림을 클릭하면 확대 할 수 있습니다. link text
감사합니다.
<div class="small_product" id="small_product1">
<img id="small_product1-1" src="images" />
<img id="small_product1-2" src="images" />
</div>
<div class="big_product" id="big_product1-1">
<img id="thumbnail1-1" src="#" />
<img id="full1-1" src="#" />
</div>
$(function() {
var fullWidth = 950; // Width in pixels of full-sized image
var fullHeight = 1000; // Height in pixels of full-sized image
var thumbnailWidth = 320; // Width in pixels of thumbnail image
var thumbnailHeight = 480; // Height in pixels of thumbnail image
// Toggle full and thumbnail pictures on click
$('#big_product1-1').click(function() {
$('#thumbnail1-1').toggle();
$('#full1-1').toggle();
});
// Do some calculations
$('#big_product1-1').mousemove(function(e) {
var mouseX=0;var mouseY=0;var posX=0;var posY=0;
//detect safari on Mac
var browser=navigator.userAgent;
if (browser.toLowerCase().indexOf('macintosh') > 0) {
mouseX = (e.screenX-200) - $(this).attr('offsetLeft');
mouseY = (e.screenY-200) - $(this).attr('offsetTop');
}else {
mouseX = (e.screenX-300) - $(this).attr('offsetLeft');
mouseY = (e.screenY-300) - $(this).attr('offsetTop');
}
posX = (Math.round((mouseX/thumbnailWidth)*100)/100) * (fullWidth-thumbnailWidth);
posY = (Math.round((mouseY/thumbnailHeight)*100)/100) * (fullHeight-thumbnailHeight);
$('#full1-1').css({
'left': '-' + posX + 'px',
'top': '-' + posY + 'px'
});
});
});
더 쉽게 읽을 수 있도록 첫 번째 형식 코드 – jitter