喜悦国际村 
» 游客:  注册 | 登录 | 搜索 | 统计 | 帮助

RSS 订阅当前论坛  

喜悦证交所已经关闭

上一主题 下一主题
 13  1/2  1  2  > 
     
标题: [代码] 图片放大缩小的问题  
 
仪琳
中级会员
Rank: 3Rank: 3
一般会员



UID 21651
精华 0
积分 224
帖子 162
金钱 224 喜悦币
威望 0
人脉 0
阅读权限 30
注册 2003-7-14
状态 离线
图片放大缩小的问题

高手帮我看看,我希望修改下面的代码,做到:
如果原图宽度大于680,不管多大,放大的宽度极限就是680。
如果原图小于680,最大放大宽度不能超过原图宽度。

<script language="JavaScript">
var zoomLevel = 0;
var currentWidth = 0;
var currentHeight = 0;
var originalWidth = 0;
var originalHeight = 0;
function initial(){
    currentWidth = document.myImage.width;
    currentHeight = document.myImage.height;
    originalWidth = currentWidth;
    originalHeight = currentHeight;
    update();
}
function zoomIn(){
    document.myImage.width = currentWidth*2;
    document.myImage.height = currentHeight*2;
    zoomLevel = zoomLevel + 1;
    update();
}
function zoomOut(){
    document.myImage.width = currentWidth/2;
    document.myImage.height = currentHeight/2;
    zoomLevel = zoomLevel - 1;
    update();
}
</script>

<body onload="initial()">

<img name="myImage" src="http://www.7788ok.com/UpLoadFiles/200512101083980752.jpg">

<input type="button" value="放大图片" onclick="zoomIn()">
<input type="button" value="缩小图片" onclick="zoomOut()">






http://www.zhuatu.com   
2007-5-7 09:35 AM#1
查看资料  发短消息  顶部
 
fly512 (我本如是)
版主
Rank: 7Rank: 7Rank: 7
人生的另一半


UID 42566
精华 0
积分 2510
帖子 2397
金钱 1780 喜悦币
威望 0
人脉 730
阅读权限 100
注册 2004-10-31
来自 亚特兰迪斯
状态 离线
[推荐阅读] 求职帖:找个PHP工作


<?php
<script type="text/javascript">
var 
zoomLevel      0;
var 
originalWidth  0;
var 
originalHeight 0;
var 
maxWidth       680;//宽度最大值
function initial(){
    var 
imgObj     = new Image();
    
imgObj.src     document.myImage.src;
    
originalWidth  imgObj.width;
    
originalHeight imgObj.height;
    
maxWidth       originalWidth maxWidth maxWidth originalWidth;
    
updateImg();
}
function 
zoomIn(){
    
zoomLevel++;
    
updateImg(1);
    
//update();
}
function 
zoomOut(){
    
zoomLevel--;
    
updateImg(0);
    
//update();
}
function 
updateImg(type)
{
    if( 
type == 0)
    {
//缩小
        
while( true)
        {
//请弄个表较大的图片测试(w:1024的)
            
var leval Math.pow(2zoomLevel);
            
alert(leval);//请将此行注释
            
if( originalWidth*leval document.myImage.width)
            {
                
zoomLevel--;    
            }
            else
            {
                break;
            }
        }
    }
    else
    {
        var 
leval Math.pow(2zoomLevel);
    }
    if(
originalWidth*leval <= maxWidth)
    {
        
document.myImage.width  originalWidth*leval;
        
document.myImage.height originalHeight*leval;
    }
    else
    {
        
document.myImage.width  maxWidth;
        
document.myImage.height = (originalHeight/originalWidth)*maxWidth;
    }
}

</script>
?>




不要使用数据库
PHP中国
2007-5-7 11:20 AM#2
查看资料  访问主页  Blog  发短消息  顶部
 
游戏人间
版主
Rank: 7Rank: 7Rank: 7
☞风云山庄大少爷☜


UID 62639
精华 2
积分 14665
帖子 7767
金钱 14515 喜悦币
威望 20
人脉 130
阅读权限 100
注册 2004-12-21
来自 广西人在北京
状态 离线
[推荐阅读] 由于资金问题.开发的分布式分类网站想卖.
用JS控制.像村里的,图片太大的时候则加个超链接.



 
群号:6025396/6025252/19520091(广西PHP交流/PHP高级编程/算法交流) 寧可在嘗試中失敗,也不在保守中成功! 不為失敗找理由,只為成功找方法! 饿踢Blog
 
2007-5-7 11:23 AM#3
查看资料  访问主页  Blog  发短消息  顶部
 
仪琳
中级会员
Rank: 3Rank: 3
一般会员



UID 21651
精华 0
积分 224
帖子 162
金钱 224 喜悦币
威望 0
人脉 0
阅读权限 30
注册 2003-7-14
状态 离线
[推荐阅读] c语言如何直接调用php的dll文件?
感谢 fly512 (我本如是)
你太棒了!谢谢。






http://www.zhuatu.com   
2007-5-7 12:40 PM#4
查看资料  发短消息  顶部
 
仪琳
中级会员
Rank: 3Rank: 3
一般会员



UID 21651
精华 0
积分 224
帖子 162
金钱 224 喜悦币
威望 0
人脉 0
阅读权限 30
注册 2003-7-14
状态 离线
[推荐阅读] 数据库乱码问题?急求解
请教 fly512 老师:

您的代码能不能取得当前图片的尺寸?
具体请看。这是我原来的代码(无法实现我一楼索要的放大限制功能):

<script language="JavaScript">
var zoomLevel = 0;
var currentWidth = 0;
var currentHeight = 0;
var originalWidth = 0;
var originalHeight = 0;
function initial(){
    currentWidth = document.testImage.width;
    currentHeight = document.testImage.height;
    originalWidth = currentWidth;
    originalHeight = currentHeight;
    update();
}
function zoomIn(){
    document.testImage.width = currentWidth*2;
    document.testImage.height = currentHeight*2;
    zoomLevel = zoomLevel + 1;
    update();
}
function zoomOut(){
    document.testImage.width = currentWidth/2;
    document.testImage.height = currentHeight/2;
    zoomLevel = zoomLevel - 1;
    update();
}
function resetImage(){
    document.testImage.width = originalWidth;
    document.testImage.height = originalHeight;
    zoomLevel = 0;
    update();
}
function update(){
    currentWidth = document.testImage.width;
    currentHeight = document.testImage.height;
    zoomsize.innerText = zoomLevel;
    imgsize.innerText = currentWidth + "*" + currentHeight;
    document.form1.currentWidth.value = currentWidth;
    document.form1.currentHeight.value = currentHeight;
}
</script>

<body onload="initial()">

<form name="form1">
<img name="testImage" src="1.jpg">

<input type="button" value="放大图片" onclick="zoomIn()">
<input type="button" value="缩小图片" onclick="zoomOut()">
缩放:<span id="zoomsize"></span> - 图片尺寸:<span id="imgsize"></span>  
<input type="text" name="currentWidth" >
<input type="text" name="currentHeight" >

最后两个文本框需要取得当前图片的尺寸。

您的代码实现我一楼的要求,但又无法取得图片尺寸了。我自己修改了很久,没成功。
麻烦高手帮我看看。谢谢了。






http://www.zhuatu.com   
2007-5-7 01:00 PM#5
查看资料  发短消息  顶部
 
fly512 (我本如是)
版主
Rank: 7Rank: 7Rank: 7
人生的另一半


UID 42566
精华 0
积分 2510
帖子 2397
金钱 1780 喜悦币
威望 0
人脉 730
阅读权限 100
注册 2004-10-31
来自 亚特兰迪斯
状态 离线
[推荐阅读] php中的UBB的使用
document.currentWidth.value = document.myImage.width  ;
  document.currentHeight.value = document.myImage.height ;
在updateImg函数的最后面添加




不要使用数据库
PHP中国
2007-5-7 01:07 PM#6
查看资料  访问主页  Blog  发短消息  顶部
 
phphp
版主
Rank: 7Rank: 7Rank: 7
加班一族


UID 65188
精华 1
积分 184
帖子 3007
金钱 173 喜悦币
威望 10
人脉 1
阅读权限 100
注册 2005-7-20
来自 北京市海淀区
状态 离线
[推荐阅读] PHP上传图片的解决方法
仪琳师妹:)



书到用时方恨少, 事非经过不知难
2007-5-7 01:47 PM#7
查看资料  访问主页  Blog  发短消息  QQ . .   顶部
 
仪琳
中级会员
Rank: 3Rank: 3
一般会员



UID 21651
精华 0
积分 224
帖子 162
金钱 224 喜悦币
威望 0
人脉 0
阅读权限 30
注册 2003-7-14
状态 离线
[推荐阅读] 我想做个像淘宝那样的网站要多少钱?
谢谢斑竹。谢谢各位。
呵呵。






http://www.zhuatu.com   
2007-5-7 02:04 PM#8
查看资料  发短消息  顶部
 
仪琳
中级会员
Rank: 3Rank: 3
一般会员



UID 21651
精华 0
积分 224
帖子 162
金钱 224 喜悦币
威望 0
人脉 0
阅读权限 30
注册 2003-7-14
状态 离线
[推荐阅读] phpmyadmin 配置中的controluser 和 user 分别代表什么?
感谢师兄。

有错误阿。
我希望文本框取得的尺寸是缩放之后的尺寸,也就是那个文本框的数值随着缩放在变。怎么改?这个太重要了。

还有,我希望增加一个重置:

function resetImage(){
    document.myImage.width = maxWidth;
    document.myImage.height = //这里怎么写?
    zoomLevel = 0;
    update();
}


<input type="button" value="重置" class=bdtj onclick="resetImage()">


另外,我希望增加高度的限制。现在的是判断高度。有时候图片特别高,就有点麻烦。
如果原图高度大于800,不管多大,放大的高度极限就800。
如果原图高度小于800,最大放大高度不能超过原图高度。






http://www.zhuatu.com   
2007-5-7 02:19 PM#9
查看资料  发短消息  顶部
 
fly512 (我本如是)
版主
Rank: 7Rank: 7Rank: 7
人生的另一半


UID 42566
精华 0
积分 2510
帖子 2397
金钱 1780 喜悦币
威望 0
人脉 730
阅读权限 100
注册 2004-10-31
来自 亚特兰迪斯
状态 离线
[推荐阅读] Gzip压缩后传输过来的数据(字符)太大(长),如何处理?
抱歉:上面的代码错了,偶有点想当然了

document.getElementById('currentWidth').value  = document.myImage.width  ;
document.getElementById('currentHeight').value = document.myImage.height ;

<input type="text" id="currentWidth" name="currentWidth" >
<input type="text" id="currentHeight"  name="currentHeight" >




不要使用数据库
PHP中国
2007-5-7 02:19 PM#10
查看资料  访问主页  Blog  发短消息  顶部
 13  1/2  1  2  > 
     


  可打印版本 | 推荐给朋友 | 订阅主题 | 收藏主题 | 开通个人空间  


 




Powered by Discuz! 6.1.0  © 2001-2010 Comsenz Inc.
Processed in 0.026782 second(s), 6 queries

(冀ICP备05009913号) 管理员:sadly 邮箱/MSN: sadly@phpx.com QQ:824008(长隐) 清除 Cookies - - Archiver - WAP