↑
Page Details >>>
Sometimes, your image does not look very good in different sized browser windows. This script will proportionally resize a graphic to fit within the current window or frame when a page is loaded, thus giving a more consistent and attractive look to your page.
Step 1: Add the below code to the <body> section of your page:
<script
language= "javascript"
type= "text/javascript" >
function
showpic ( src ,
w ,
h ,
alt ,
aln ,
pw ,
ph ,
bw ,
bh )
{
if
( src
==
null )
return ;
var
iw ,
ih ;
if
( window . innerWidth
==
null )
{
iw
=
document . body . clientWidth ;
ih = document . body . clientHeight ;
}
else
{
iw
=
window . innerWidth ;
ih
=
window . innerHeight ;
}
if
( w
==
null )
w =
iw ;
if ( h
==
null )
h =
ih ;
if ( alt
==
null )
alt
=
"Picture" ;
if ( aln
==
null )
aln =
"left" ;
if ( pw
==
null )
pw =
100 ;
if ( ph
==
null )
ph =
100 ;
if ( bw
==
null )
bw =
24 ;
if ( bh
==
null )
bh =
24 ;
var
sw =
Math . round (( iw
-
bw )
*
pw /
100 );
var
sh =
Math . round (( ih
-
bh )
*
ph /
100 );
if
(( w
*
sh )
/
( h
*
sw )
<
1 )
sw =
Math . round ( w
*
sh /
h );
else
sh =
Math . round ( h
*
sw /
w );
document . write ( '<img
src="' + src + '"
alt="' + alt + '"
width="' + sw + '"
height="' + sh + '"
align="' + aln + '">' );
}
showpic ( "faces.gif" ,
362 ,
113 ,
"Faces" ,
"middle" );
</script>
Step 2: The script uses an image as part of its interface. You can create your own, or use the below (resized for easier download):
(right click image, and select "Save Image As")
Upload it into the same directory as your webpage.
→