zoukankan
html css js c++ java
用javascript放大图片局部
<
html
>
<
head
>
<
title
>
emu
</
title
>
</
head
>
<
body
>
<
BR
>
原图:
<
BR
>
<
img
src
="http://img.pconline.com.cn/images/photo2/839980/1118509777696.JPG"
onmousemove
="zoom()"
id
=srcImg>
<BR
>
局部放大图:
<
BR
>
<
div
style
="overflow:hidden"
><
img
id
=zoomImg></div>
<SCRIPT LANGUAGE
="JavaScript"
>
<!--
zoomImg.src = srcImg.src;
srcImg.height = srcImg.height/2;
var zoomRate = 5;
zoomImg.height = srcImg.height*zoomRate;
zoomImg.parentNode.style.width = srcImg.width;
zoomImg.parentNode.style.height = srcImg.height;
function zoom(){
var elm = event.srcElement;
h = elm.offsetHeight/zoomRate/2;
w = elm.offsetWidth/zoomRate/2;
var x = event.x-elm.offsetLeft;
x=x<(elm.offsetWidth-w)?x<w?w:x:elm.offsetWidth-w;
zoomImg.style.marginLeft=(w-x)*zoomRate;
var y = event.y-elm.offsetTop;
y=y<(elm.offsetHeight-h)?y<h?h:y:elm.offsetHeight-h;
zoomImg.style.marginTop=(h-y)*zoomRate;
}
//
-->
</
SCRIPT
>
</
body
>
</
html
>
查看全文
相关阅读:
Collection 和 Collections的区别?
事务是什么?有哪些属性,并简要说明这些属性的含义。
jsp有哪些内置对象?作用分别是什么?(至少三个)
谈谈对XML的理解?说明Web应用中Web.xml文件的作用?
类有哪三个基本特性?各特性的优点?
Oracle安装完成后,如何用命令行启动和关闭数据库?
请说明SQLServer中delete from tablea & truncate table tablea的区别
试述数据库完整保护的主要任务和措施。
存储过程和函数的区别
性能
原文地址:https://www.cnblogs.com/stonehuang/p/6603227.html
最新文章
[置顶] 如何在浏览器中打开PDF文件并实现预览的思路与代码
正则表达式,抓取网页所有图片
Scriptcase优惠活动即将结束
【LeetCode】 Subsets
jshint 安装使用
[置顶] EASYUI+MVC4+VS2010通用权限管理系统开发
“IPSec 共享密钥”丢失。
深入DNS
linux 5 配置xmanager
Oracle用户的单张表的读写权限控制
热门文章
列出自己常用的jdk中的数据结构
列出自己常用的jdk包.
说明反转控制(IOC)和面向方向编程(AOP)在spring中的应用
简要描述如何结合struts、hibernate、spring开发Web应用?
请谈谈对SOA的认识。
描述J2EE框架的多层结构,并简要说明各层的作用。
请说出ArrayList,Vector, LinkedList的存储性能和特性
HashMap和Hashtable的区别?
ArrayList和Vector的区别?
HashMap与TreeMap的区别?
Copyright © 2011-2022 走看看