新页面打开实际尺寸的图片


Posted in Javascript onAugust 25, 2006
<script language="JavaScript" type="text/JavaScript"> 
<!-- 
var imgObj; 
function checkImg(theURL,winName){ 
  if (typeof(imgObj) == "object"){ 
    // 是否已取得了图像的高度和宽度 
    if ((imgObj.width != 0) && (imgObj.height != 0)) 
      // 根据取得的图像高度和宽度设置弹出窗口的高度与宽度,并打开该窗口 
      // 其中的增量 20 和 30 是设置的窗口边框与图片间的间隔量 
      OpenFullSizeWindow(theURL,winName, ",width=" + (imgObj.width+20) + ",height=" + (imgObj.height+30)); 
    else 
      // 因为通过 Image 对象动态装载图片,不可能立即得到图片的宽度和高度,所以每隔100毫秒重复调用检查 
      setTimeout("checkImg('" + theURL + "','" + winName + "')", 100) 
  } 
} function OpenFullSizeWindow(theURL,winName,features) { 
  var aNewWin, sBaseCmd; 
  // 弹出窗口外观参数 
  sBaseCmd = "toolbar=no,location=no,status=no,menubar=no,scrollbars=no,resizable=no,"; 
  // 调用是否来自 checkImg  
  if (features == null || features == ""){ 
    // 创建图像对象 
    imgObj = new Image(); 
    // 设置图像源 
    imgObj.src = theURL; 
    // 开始获取图像大小 
    checkImg(theURL, winName) 
  } 
  else{ 
    // 打开窗口 
    aNewWin = window.open(theURL,winName, sBaseCmd + features); 
    // 聚焦窗口 
    aNewWin.focus(); 
  } 
} 
//--> 
</script> 

使用时将上面的代码放在网页文档的<head></head>标记对中,然后在链接的点击事件中调用OpenFullSizeWindow函数,如<a href="fullsize.jpg" onClick="OpenFullSizeWindow(this.href,'','');return false"><img src="small.jpg"></a>即可
Javascript 相关文章推荐
javascript 节点遍历函数
Mar 28 Javascript
jquery 图片 上一张 下一张 链接效果(续篇)
Apr 20 Javascript
mailto的使用技巧分享
Dec 21 Javascript
js获得鼠标的坐标值的方法
Mar 13 Javascript
在JS数组特定索引处指定位置插入元素
Jul 27 Javascript
Node.js中child_process实现多进程
Feb 03 Javascript
JavaScript DOM基础
Apr 13 Javascript
JavaScript toUpperCase()方法使用详解
Aug 26 Javascript
微信小程序 跳转方式总结
Apr 20 Javascript
jQuery实现的表格前端排序功能示例
Sep 18 jQuery
angular 内存溢出的问题解决
Jul 12 Javascript
Node.js 中如何收集和解析命令行参数
Jan 08 Javascript
js获取变量
Aug 24 #Javascript
在b/s开发中经常用到的javaScript技术
Aug 23 #Javascript
两个SUBMIT按钮,如何区分处理
Aug 22 #Javascript
解决 FireFox 下[使用event很麻烦] 的问题.
Aug 22 #Javascript
Javascript客户端脚本的设计和应用
Aug 21 #Javascript
让iframe框架网页在任何浏览器下自动伸缩
Aug 18 #Javascript
去除链接虚线全面分析总结
Aug 15 #Javascript
You might like
一个PHP分页类的代码
2011/05/18 PHP
解析PHP的session过期设置
2013/06/29 PHP
php通过数组实现多条件查询实现方法(字符串分割)
2014/05/06 PHP
php连接mysql数据库最简单的实现方法
2019/09/24 PHP
Jquery实现仿新浪微博获取文本框能输入的字数代码
2013/02/22 Javascript
鼠标经过子元素触发mouseout,mouseover事件的解决方案
2015/07/26 Javascript
详解Angular 4.x NgIf 的用法
2017/05/22 Javascript
React组件refs的使用详解
2018/02/09 Javascript
Angular4学习笔记router的简单使用
2018/03/30 Javascript
js 数组详细操作方法及解析合集
2018/06/01 Javascript
使用proxy实现一个更优雅的vue【推荐】
2018/06/19 Javascript
Vue项目部署在Spring Boot出现页面空白问题的解决方案
2018/11/26 Javascript
微信小程序下拉刷新PullDownRefresh的使用方法
2018/11/29 Javascript
如何在vue里面优雅的解决跨域(路由冲突问题)
2019/01/20 Javascript
JS数组push、unshift、pop、shift方法的实现与使用方法示例
2020/04/29 Javascript
v-slot和slot、slot-scope之间相互替换实例
2020/09/04 Javascript
[02:10]探秘浦东源深体育馆 DOTA2 Supermajor不见不散
2018/05/17 DOTA
在Python的Django框架中显示对象子集的方法
2015/07/21 Python
深入理解Python中命名空间的查找规则LEGB
2015/08/06 Python
Python+Selenium+PIL+Tesseract自动识别验证码进行一键登录
2017/09/20 Python
python+matplotlib演示电偶极子实例代码
2018/01/12 Python
python将字典内容存入mysql实例代码
2018/01/18 Python
Python cookbook(字符串与文本)针对任意多的分隔符拆分字符串操作示例
2018/04/19 Python
Pandas之groupby( )用法笔记小结
2019/07/23 Python
对Pytorch中Tensor的各种池化操作解析
2020/01/03 Python
在IE6系列等老式浏览器中使用HTML5的新标签实现方案
2012/12/25 HTML / CSS
个性化皮包、小袋、生活配件:Mon Purse
2019/03/26 全球购物
高中军训广播稿
2014/01/14 职场文书
工程招投标邀请书
2014/01/30 职场文书
商场主管竞聘书
2014/03/31 职场文书
医学生求职信
2014/07/01 职场文书
门面房租房协议书
2014/12/01 职场文书
服务员岗位职责
2015/02/03 职场文书
实习指导老师意见
2015/06/04 职场文书
导游词之任弼时故居
2020/01/07 职场文书
MySQL分库分表与分区的入门指南
2021/04/22 MySQL