Guest Posted April 13, 2011 Share Posted April 13, 2011 Here's my function: var cropPic = document.getElementById('cropPic'); var cropFrame = document.getElementById('cropFrame'); var cropPicWidth = cropPic.clientWidth; var cropPicHeight = cropPic.clientHeight; var cropFrameWidth = cropFrame.clientWidth; var cropFrameHeight = cropFrame.clientHeight; var maxX = cropPicWidth - cropFrameWidth; var maxY = cropPicHeight - cropFrameHeight; cropFrame.style.left = (cropPicWidth / 2) - (cropFrameWidth / 2); cropFrame.style.top = (cropPicHeight / 2) - (cropPicHeight / 2); Obviously, it cropFrame in the middle center of cropPic. Thing is, it totally doesn't work unless I delete the doctype declaration from the head of my HTML! <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> Why on Earth would the doctype kill my function? Makes no sense at all to me... Link to comment https://forums.phpfreaks.com/topic/233566-using-proper-doctype-declaration-breaks-javascript/ Share on other sites More sharing options...
nogray Posted April 13, 2011 Share Posted April 13, 2011 When you set the style you need to add "px" after the top or left. e.g. cropFrame.style.left = ((cropPicWidth / 2) - (cropFrameWidth / 2))+"px"; cropFrame.style.top = ((cropPicHeight / 2) - (cropPicHeight / 2))+"px"; Link to comment https://forums.phpfreaks.com/topic/233566-using-proper-doctype-declaration-breaks-javascript/#findComment-1200976 Share on other sites More sharing options...
Guest Posted April 13, 2011 Share Posted April 13, 2011 Awesome! Thanks, nogray. Link to comment https://forums.phpfreaks.com/topic/233566-using-proper-doctype-declaration-breaks-javascript/#findComment-1201134 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.