网页里控制图片大小的相关代码


Posted in Javascript onJune 25, 2006

1、用鼠标拖动来改变大小
<SCRIPT LANGUAGE="JavaScript">
function resizeImage(evt,obj){
newX=evt.x
newY=evt.y
obj.width=newX
obj.height=newY
}
</script>
<img src="7say.gif" ondrag="resizeImage(event,this)">

2、用鼠标滚动控制图片大小
<img src="7say.gif" onmouseenter="focus();" onmouseout="blur();" onmousewheel="width+=(window.event.wheelDelta==120)?-5:+5;">

3、图片标签里用代码控制大小
<img border="0" src="[!--picurl--]" onload="if(this.width>screen.width-500)this.style.width=screen.width-500;">

4、CSS控制图片大小
1. css2直接实现: img{max-width: 500px;} (IE暂不支持)
2. expression实现: img{width:expression(width>500?"500px":width);} (IE only)
3. 使用js. 方法: 用 document.getElementsByTagName("IMG") 的方法取得全部img元素 遍历img元素 判断其宽度并做相应操作

Javascript 相关文章推荐
javascript call和apply方法
Nov 24 Javascript
关于IE浏览器以及Firefox下的javascript冒泡事件的响应层级
Oct 14 Javascript
Node.js环境下编写爬虫爬取维基百科内容的实例分享
Jun 12 Javascript
浅谈js中的in-for循环
Jun 28 Javascript
js替换字符串中所有指定的字符(实现代码)
Aug 17 Javascript
JS实现“隐藏与显示”功能(多种方法)
Nov 24 Javascript
uploader秒传图片到服务器完整代码
Apr 22 Javascript
微信小程序收藏功能的实现代码
Jun 12 Javascript
微信小程序自定义tabBar组件开发详解
Sep 24 Javascript
vue使用高德地图根据坐标定位点的实现代码
Aug 22 Javascript
基于Echarts图表在div动态切换时不显示的解决方式
Jul 20 Javascript
React 高阶组件HOC用法归纳
Jun 13 Javascript
如何取得中文输入的真实长度?
Jun 24 #Javascript
快速保存网页中所有图片的方法
Jun 23 #Javascript
网页常用特效代码整理
Jun 23 #Javascript
文本加密解密
Jun 23 #Javascript
解密效果
Jun 23 #Javascript
CheckBox 如何实现全选?
Jun 23 #Javascript
JavaScript实际应用:innerHTMl和确认提示的使用
Jun 22 #Javascript
You might like
PHP中使用array函数新建一个数组
2015/11/19 PHP
php大小写转换函数(strtolower、strtoupper)用法介绍
2017/11/17 PHP
asp批量修改记录的代码
2008/06/25 Javascript
JavaScript Event学习第三章 早期的事件处理程序
2010/02/07 Javascript
16个最流行的JavaScript框架[推荐]
2011/05/29 Javascript
jquery幻灯片插件bxslider样式改进实例
2014/10/15 Javascript
js给网页加上背景音乐及选择音效的方法
2015/03/03 Javascript
js上传图片及预览功能实例分析
2015/04/24 Javascript
js中使用使用原型(prototype)定义方法的好处详解
2016/07/04 Javascript
基于jQuery实现歌词滚动版音乐播放器的代码
2016/09/17 Javascript
利用vue写todolist单页应用
2016/12/15 Javascript
JS中解决谷歌浏览器记住密码输入框颜色改变功能
2017/02/13 Javascript
用vue写一个仿简书的轮播图的示例代码
2018/03/13 Javascript
vue axios 给生产环境和发布环境配置不同的接口地址(推荐)
2018/05/08 Javascript
vue、react等单页面项目部署到服务器的方法及vue和react的区别
2018/09/29 Javascript
解决layui checkbox 提交多个值的问题
2019/09/02 Javascript
vue 设置 input 为不可以编辑的实现方法
2019/09/19 Javascript
使用JavaScript通过前端发送电子邮件
2020/05/22 Javascript
Python实现拼接多张图片的方法
2014/12/01 Python
python得到电脑的开机时间方法
2018/10/15 Python
详解Python图像处理库Pillow常用使用方法
2019/09/02 Python
Django 实现Admin自动填充当前用户的示例代码
2019/11/18 Python
使用apiDoc实现python接口文档编写
2019/11/19 Python
使用 django orm 写 exists 条件过滤实例
2020/05/20 Python
Champion澳大利亚官网:美国冠军运动服装
2018/05/07 全球购物
销售类个人求职信范文
2013/09/25 职场文书
幼儿园小班植树节活动方案
2014/03/04 职场文书
党的群众路线对照检查材料
2014/08/27 职场文书
2014年银行柜员工作总结
2014/11/12 职场文书
大学感恩节活动总结
2015/05/05 职场文书
人民检察院起诉书
2015/05/20 职场文书
2015年外贸业务员工作总结范文
2015/05/23 职场文书
Django如何创作一个简单的最小程序
2021/05/12 Python
mysql5.6主从搭建以及不同步问题详解
2021/12/04 MySQL
Java8利用Stream对列表进行去除重复的方法详解
2022/04/14 Java/Android
Mysql数据库事务的脏读幻读及不可重复读详解
2022/05/30 MySQL