联系站长 加入收藏 设为首页 繁體中文 RSS
  首页 | 生活百科 | 电脑网络 | 高手学堂 | 语录名言 | 读书文学 | 极品软件 | 奇趣图片 | 站长微博  
 您的位置: 精品百字节网 >> 电脑网络 >> 网络编程 >> 精品代码 >> 正文 当前没有通告!
   □  解析代码控制iframe框架中的图片居中    4星级
解析代码控制iframe框架中的图片居中
[ 作者:明主天下     来源:本站原创     点击数:     更新时间:2007-08-08     文章录入:Admin
【字体:
[内容提要]
暂无简介

 

 

A.htm 主页面 代码如下:

<!--
作者:明主天下,
功能:通过代码实现控制框架中的图片元素居中显示
主页:http://www.100byte.com
转摘请不要去掉上面的说明
 -->

<html>  
<head>  
<title>A页面</title>  
<meta   http-equiv="Content-Type"   content="text/html;   charset=gb2312">
</head>  
<body>  
<script language="JavaScript">  
<!--  
//功能是强制图片居中
function OrderImgCenter()  {
var imgHeight,imgWidth,imgHspace,imgVspace
//当iframe中只有一个图像时
if (PicShow.document.images.length==1) 
{  
//计算图片的hspace和vspace值
imgHeight=PicShow.document.images[0].height;
imgWidth =PicShow.document.images[0].width;
//其中400是指iframe的宽度和高度值,可变化
imgHspace=(400-imgWidth)/2;
imgVspace=(400-imgHeight)/2;
PicShow.document.images[0].hspace=imgHspace;
PicShow.document.images[0].vspace=imgVspace;

}
//-->  
</script>
<table   width="500"   border="1"   cellpadding="0"   cellspacing="0"   bgcolor="2070BF">
 <tr align="center">    
    <td   width="100"  bgcolor="#99CCFF">图片展厅</td>  
    <td    bgcolor="#FFFFFF">    
   <iframe name="PicShow" frameborder="0" width="400" height="400" scrolling="no" src="b.htm"  onreadystatechange="OrderImgCenter()"></iframe>
    </td>  
   </tr>  
</table>
</body>  
</html>

B.htm 图片显示页面:
<html>   
<head>   
<title>B页面</title>   
<meta http-equiv="Content-Type" content="text/html;charset=gb2312">   
</head>   
<body>
<img src="http://www.100byte.com/images/logo.gif" align="absmiddle"  name="1">
</body>   
</html>
上一篇文章:Js代码实现文章水印功能(文章防复制) 下一篇文章:加入收藏的javascript代码
发表评论 □告诉好友 □打印此文 □收藏此页 □关闭窗口 □返回顶部
 最新热点文章
 精品医院类网站网址大收集
 如何删除windows 2003或xp系统隐藏的...
 DedeCms管理员后台登陆经常自动退出的...
 知道IP如何用dos命令查出电脑名称
 WORD出错老是要求以安全模式打开文件...
 如何设置首页不显示页眉页脚?
 如何利用inurl命令查询网站外链及栏目...
 
 最新推荐文章
 精品医院类网站网址大收集
 如何利用宽带路由器控制局域网内电脑上...
 CSS圆角代码的实现方法
 带停顿的单行文字滚动代码
 实用的新网站免费收录提交地址精选
 Left join , Right Join, Inner Join用...
 趣话淘宝网衍生的多种新型职业
 
 最新图文
  ◇  网友评论:(只显示最新5条。评论内容只代表网友观点,与本站立场无关!)
关于本站 | 免责申明 | 网站地图 | 联系站长 | 友情链接 | 与我同在
冀ICP备06032589号【虚拟化精英群虚拟化精英群续
  Copyright© 2006-2009 100byte.Com All Rights Reserved
网站声明:本网站是公益性质网站,部分内容来源于网络,如有侵犯您权利的地方,请与精品百字节站长联系,尽快修正.
Powered By CreateLive CMS 本站法律顾问:(冀港)武镇海律师
点击这里给我发消息