<!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>Resizable Image Page</title>
</head>
<body>
<div id="ContentDiv" style="left: 0px; width: 100%; position: absolute; top: 0px;
height: 100%; background-color: Black; vertical-align: middle;">
<script type="text/javascript">
window.onresize = ResizePicture;
function ResizePicture()
{
var PictureImage = document.getElementById('PictureImage');
var ContentDiv = document.getElementById('ContentDiv');
try
{
if (ContentDiv.offsetHeight < PictureImage.offsetHeight)
{
PictureImage.style.height = ContentDiv.offsetHeight - 16 + 'px';
PictureImage.style.width = 'auto';
}
else if (ContentDiv.offsetWidth < PictureImage.offsetWidth)
{
PictureImage.style.width = ContentDiv.offsetWidth - 16 + 'px';
PictureImage.style.height = 'auto';
}
}
catch (e)
{
ContentDiv.innerHTML = ContentDiv.innerHTML;
}
}
</script>
<table id="ContentTable" style="width: 100%; height: 100%; vertical-align: middle;
text-align: center;">
<tr>
<td>
<img id="PictureImage" onload="ResizePicture()" src="Picture.jpg" alt="Resizable Image"
style="border-right: white 4px dashed; border-top: white 4px dashed; border-left: white 4px dashed;
border-bottom: white 4px dashed" />
</td>
</tr>
</table>
</div>
</body>
</html>Resize a picture to fit web browser.
Subscribe to:
Post Comments (Atom)
No comments:
Post a Comment