- 浏览: 464622 次
- 性别:
- 来自: 广州
文章分类
- 全部博客 (190)
- ExtJS (40)
- JavaScript (16)
- Java设计模式 (13)
- Html (10)
- Tomcat (9)
- myeclipse (5)
- JSP (5)
- CSS (10)
- JS/CSS (1)
- windows (12)
- Navicat For MySQL (1)
- struts2 (6)
- Spring2.0 (1)
- Java反射机制 (5)
- hibernate (9)
- java (17)
- B/SWeb完美打印方案 (1)
- 数据库相关 (4)
- java web报表 (1)
- 报表打印 (2)
- java泛型 (1)
- Servlet (2)
- SVN (7)
- Log4j (0)
- android (3)
最新评论
-
kation733:
斯蒂芬斯蒂芬多萨法阿凡达是否阿萨德
同时开启两个Tomcat -
BlueBing:
一路的夏天 写道楼主的代码会报错吧!在前面的时候String ...
使用Java反射机制遍历实体类的属性和类型 -
ying890:
非常感谢!
Ext JS中文乱码解决方案 -
zhylandroid:
谢谢了,对我很有帮助
DatabaseMetaData开发实务(上) -
wendy.wujing:
maxHttpHeaderSize="8192&qu ...
查看Tomcat配置的端口
<html>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>JS网页图片查看器-可控制图片放大缩小还原移动效果</title>
<META HTTP-EQUIV="imagetoolbar" CONTENT="no">
<style type="text/css">
body { font-family: "Verdana", "Arial", "Helvetica", "sans-serif"; font-size: 12px; line-height: 180%; }
td { font-size: 12px; line-height: 150%; }
</style>
<SCRIPT language=JavaScript>
drag = 0
move = 0
// 拖拽对象
// 参见:http://blog.sina.com.cn/u/4702ecbe010007pe
var ie=document.all;
var nn6=document.getElementById&&!document.all;
var isdrag=false;
var y,x;
var oDragObj;
function moveMouse(e) {
if (isdrag) {
oDragObj.style.top = (nn6 ? nTY + e.clientY - y : nTY + event.clientY - y)+"px";
oDragObj.style.left = (nn6 ? nTX + e.clientX - x : nTX + event.clientX - x)+"px";
return false;
}
}
function initDrag(e) {
var oDragHandle = nn6 ? e.target : event.srcElement;
var topElement = "HTML";
while (oDragHandle.tagName != topElement && oDragHandle.className != "dragAble") {
oDragHandle = nn6 ? oDragHandle.parentNode : oDragHandle.parentElement;
}
if (oDragHandle.className=="dragAble") {
isdrag = true;
oDragObj = oDragHandle;
nTY = parseInt(oDragObj.style.top+0);
y = nn6 ? e.clientY : event.clientY;
nTX = parseInt(oDragObj.style.left+0);
x = nn6 ? e.clientX : event.clientX;
document.onmousemove=moveMouse;
return false;
}
}
document.onmousedown=initDrag;
document.onmouseup=new Function("isdrag=false");
function clickMove(s){
if(s=="up"){
dragObj.style.top = parseInt(dragObj.style.top) + 100;
}else if(s=="down"){
dragObj.style.top = parseInt(dragObj.style.top) - 100;
}else if(s=="left"){
dragObj.style.left = parseInt(dragObj.style.left) + 100;
}else if(s=="right"){
dragObj.style.left = parseInt(dragObj.style.left) - 100;
}
}
function smallit(){
var height1=images1.height;
var width1=images1.width;
images1.height=height1/1.2;
images1.width=width1/1.2;
}
function bigit(){
var height1=images1.height;
var width1=images1.width;
images1.height=height1*1.2;
images1.width=width1*1.2;
}
function realsize()
{
images1.height=images2.height;
images1.width=images2.width;
block1.style.left = 0;
block1.style.top = 0;
}
function featsize()
{
var width1=images2.width;
var height1=images2.height;
var width2=360;
var height2=200;
var h=height1/height2;
var w=width1/width2;
if(height1<height2&&width1<width2)
{
images1.height=height1;
images1.width=width1;
}
else
{
if(h>w)
{
images1.height=height2;
images1.width=width1*height2/height1;
}
else
{
images1.width=width2;
images1.height=height1*width2/width1;
}
}
block1.style.left = 0;
block1.style.top = 0;
}
</SCRIPT>
<script language="JavaScript" type="text/JavaScript">
<!--
function MM_reloadPage(init) { //reloads the window if Nav4 resized
if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);
//-->
</script>
<style type="text/css">
<!--
td, a { font-size:12px; color:#000000 }
#Layer1 { position:absolute; z-index:100; top: 10px; }
#Layer2 { position:absolute; z-index:1; }
-->
</style>
</head>
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onLoad="init();" oncontextmenu="return false" ondragstart="return false" onselectstart ="return false" onselect="document.selection.empty()" oncopy="document.selection.empty()" onbeforecopy="return false"onmouseup="document.selection.empty()" style="overflow-y:hidden;overflow-x:hidden;">
<div id="Layer1">
<table border="0" cellspacing="2" cellpadding="0">
<tr>
<td> </td>
<td><img src="/Images2008/map/up.gif" width="20" height="20" style="cursor:hand" onClick="clickMove('up')" title="向上"></td>
<td> </td>
</tr>
<tr>
<td><img src="/Images2008/map/left.gif" width="20" height="20" style="cursor:hand" onClick="clickMove('left')" title="向左"></td>
<td><img src="/Images2008/map/zoom.gif" width="20" height="20" style="cursor:hand" onClick="realsize();" title="还原"></td>
<td><img src="/Images2008/map/right.gif" width="20" height="20" style="cursor:hand" onClick="clickMove('right')" title="向右"></td>
</tr>
<tr>
<td> </td>
<td><img src="/Images2008/map/down.gif" width="20" height="20" style="cursor:hand" onClick="clickMove('down')" title="向下"></td>
<td> </td>
</tr>
<tr>
<td> </td>
<td><img src="/Images2008/map/zoom_in.gif" width="20" height="20" style="cursor:hand" onClick="bigit();" title="放大"></td>
<td> </td>
</tr>
<tr>
<td> </td>
<td><img src="/Images2008/map/zoom_out.gif" width="20" height="20" style="cursor:hand" onClick="smallit();" title="缩小"></td>
<td> </td>
</tr>
</table>
</div>
<p><br>
<div id='hiddenPic' style='position:absolute; left:0px; top:0px; width:0px; height:0px; z-index:1; visibility: hidden;'><img name='images2' src='/UploadFile/taobao0809/760-480bsx.jpg' border='0'></div>
<div id='block1' onmouseout='drag=0' onmouseover='dragObj=block1; drag=1;' style='z-index:10; height: 0; left: 0px; position: absolute; top: 0px; width: 0' class="dragAble"> <img name='images1' src='/UploadFile/taobao0809/760-480bsx.jpg' border='0'></div>
</body>
</html>
发表评论
-
JS中match、replace方法中使用正则表达式
2011-03-17 22:23 1416正则表达式由来已久,查找替换功能非常强大,但模板难记复杂。 J ... -
[共享代码]重写JS的toFixed属性,解决JS数值处理精度问题
2010-03-12 14:22 1792Number.prototype.toFixed=functi ... -
js 日期计算
2010-02-22 08:57 1550js代码: //---------------------- ... -
javascript 中的this指针
2009-08-07 09:13 1052this 指钟是JavaScript语言中的一个特殊指 ... -
splice(start,deleteCount,val1,val2,...):从start位置开始删除deleteCount项
2009-07-09 11:10 1172splice(start,deleteCount,val1,v ... -
实现DIV圆角的js代码和使用方法
2009-06-30 14:53 3204这个程序是个用来制作DIV圆角的开源JavaScript代码实 ... -
javascript面向对象技术基础(六)
2009-06-23 17:43 829先来简单说一下变量作 ... -
javascript面向对象技术基础(五)
2009-06-23 17:24 928在javascript中,所有的方法都有一个call方法和ap ... -
javascript面向对象技术基础(四)
2009-06-23 11:56 829先来说明一点:在上面的内容中提到,每一个函数都包含了一个pro ... -
javascript面向对象技术基础(一)
2009-06-23 11:48 1000对象和数组(Objects and Arrays)什么是对象? ... -
JS添加事件处理函数
2009-06-20 16:24 1338作为一种事件驱动的编程语言,Js的程序很少主动执行,一般都是由 ... -
e.target 和event.srcElement
2009-06-20 16:04 4497mozilla下的e.target 相当于 ie下的e ... -
javascript中settimeout和setinterval函数的用法和实例
2009-06-11 14:30 2468关键字: javascript中settimeout和seti ... -
js中的call()和apply()方法
2009-06-07 20:25 1948Javascript 中的function本身 ... -
javascript typeof的用法
2009-06-07 12:27 1419typeof 运算符 返回一个用来表示表达式的数据类型的字符 ...
相关推荐
用JS实现和google地图类似的图片查看器 -----图片放大、缩小、移动和还原,都控制在div里,兼容ie,FF
用JS实现和google地图类似的图片查看器 -----图片放大、缩小、移动和还原,都控制在div里,兼容ie,FF
JS网页图片查看器-可控制图片放大缩小还原移动效果 body { font-family: “Verdana”, “Arial”, “Helvetica”, “sans-serif”; font-size: 12px; line-height: 180%; } td { font-size: 12px; line-height: ...
JS图片查看器,带上下左右平移、放大缩小、图片旋转功能。很好很强大~!O(∩_∩)O 支持Firefox,除旋转以外的功能。
|--网络图片查看器 |--网络图片的下载与缓存 |--网络文件的下载与关联进度条 |--联系人之各种查找 |--联系人读写与批量操作 |--联系人读取 |--自定义shape形状颜色渐变资源 |--自定义Toast |--自定义view的属性 |--...
安卓网络图片查看放大缩小,带有本地图片查看.zip,太多无法一一验证是否可用,程序如果跑不起来需要自调,部分代码功能进行参考学习。
html图片控制处理放大缩小移动多种案例(附源码),简约图片预览,仿京东图片放大镜效果,图片查看器,可放大缩小,旋转,图片放大镜效果,图片放大缩小查看,图片放大显示,支持滚轮调整大小,图片上下滑动缩略图字幕...
结合网上的一些源码和书上的源码弄了个C#开发的winform的简易图片放大缩小。功能:打开图片,支持放大和缩小功能,一开始能展现全图,能无限放大和缩小到原图。保持居中展示。滚动条保持居中。还有一个可以旋转的请...
实现Silverlight下的图片放大、缩小、移动功能
js 图片查看器 放大 缩小 左右反转 反转 实战应用 支持各种图片 tif\jpg\jpeg\bmp\tif等
一个自定义的图片查看器,功能类似于手机相册中图片展示界面,自定义imageview,可以实现图片随手势实现放大、缩小、移动等功能。效果十分流畅。代码也比较简单、完善。
Web_使用pinchzoom插件实现图片手势缩放. 效果描述: 一个基于jQuery的插件——Pinchzoom.js 可以实现移动网页中的图片放大或者缩小,用手指控制即可 当然,其中的jQuery完全可以换成zepto.js
打开html可直接查看例子,例子中图片url写死的,是一个网络图片,如果该图片不见了可直接更改那个地址。 完全是自己写的滚动和拖动行为
易语言IE查看器源码系统结构:分析数据,AAAA,BBBB,CCCC,DDDD, ======窗口程序集1 || ||------_服务器1_数据到达 || ||------分析数据 || ||------AAAA || ||------BBBB || ||------CCCC || ||------DDDD
viewpager+photoview自带圆点支持放大缩小,仿微信朋友圈图片查看器,自定义dialog [注意:本资源来自网络,如有侵权,请联系我删除,谢谢。]
一个前端图片查看器,可以实现图片翻转、鼠标放大缩小等功能,预览地址:http://www.jq22.com/demo/jQueryViewer20160329/index.html,内附文档。
图片查看,网络图片查看,带有本地图片查看功能,放大缩小
C# 写的图片查看器,实现了图片的放大缩小旋转,等功能,是用来练手的必备参考代码
有注释