jQuery设置图片等比例缩小的方法


Posted in jQuery onApril 29, 2017

本文实例讲述了jQuery设置图片等比例缩小的方法。分享给大家供大家参考,具体如下:

网站的内容页面,经常要放图片,如果图片太大会撑出,影响页面美观。如果只是用css限制图片的最大宽度,会引起图片的变形,这里建议还是用js来实现,实现方式如下:

<script language="javascript" type="text/javascript">
window.onload = function () {
  //判断图片大小,超过一定宽度,要通过js定义图片大小
  $.each($(".sec-content img"), function (i, v) {
    if (v.width > 740)
    {
      v.width = 740; //重定义编辑器自带的宽度
      v.removeAttribute('height'); //移除编辑器自带的图片高度
    }
  });
}
</script>

注意,引用本方法前前先引入jQuery。$(".sec-content img")这里是文章内容中的图片筛选。

希望本文所述对大家jQuery程序设计有所帮助。

jQuery 相关文章推荐
使用jQuery,Angular实现登录界面验证码详解
Apr 27 jQuery
最常用的jQuery表单验证(简单)
May 23 jQuery
jQuery实现拖动效果的实例代码
Jun 25 jQuery
jQuery实现frame之间互通的方法
Jun 26 jQuery
jquery插件开发之选项卡制作详解
Aug 30 jQuery
jquery自定义显示消息数量
Dec 19 jQuery
jQuery中的for循环var与let的区别
Apr 21 jQuery
JQuery事件委托(适用于给动态生成的脚本元素添加事件)
Feb 01 jQuery
jQuery带控制按钮轮播图插件
Jul 31 jQuery
jQuery实现开关灯效果
Aug 02 jQuery
jQuery实现简单全选框
Sep 13 jQuery
jquery自定义组件实例详解
Dec 31 jQuery
node.js+jQuery实现用户登录注册AJAX交互
Apr 28 #jQuery
jQuery使用eraser.js插件实现擦除、刮刮卡效果的方法【附eraser.js下载】
Apr 28 #jQuery
jquery实现图片上传前本地预览
Apr 28 #jQuery
jQuery实现jQuery-form.js实现异步上传文件
Apr 28 #jQuery
jQuery tip提示插件(实例分享)
Apr 28 #jQuery
jQuery自定义元素右键点击事件(实现案例)
Apr 28 #jQuery
jQuery实现动态添加、删除按钮及input输入框的方法
Apr 27 #jQuery
You might like
十天学会php之第三天
2006/10/09 PHP
php中的curl使用入门教程和常见用法实例
2014/04/10 PHP
PHP操作MySQL事务实例
2014/11/05 PHP
php实现MySQL数据库备份与还原类实例
2014/12/09 PHP
PHP脚本监控Nginx 502错误并自动重启php-fpm
2015/05/13 PHP
PHP常见的6个错误提示及解决方法
2016/07/07 PHP
javascript对象的property和prototype是这样一种关系
2007/03/24 Javascript
jQuery修改CSS伪元素属性的方法
2014/07/30 Javascript
jQuery实现在textarea指定位置插入字符或表情的方法
2015/03/11 Javascript
js/jquery判断浏览器类型的方法小结
2015/05/12 Javascript
Webpack 实现 AngularJS 的延迟加载
2016/03/02 Javascript
js根据json数据中的某一个属性来给数据分组的方法
2018/10/08 Javascript
深入理解移动前端开发之viewport
2018/10/19 Javascript
了解javascript中变量及函数的提升
2019/05/27 Javascript
vue组件三大核心概念图文详解
2019/05/30 Javascript
微信小程序之 catalog 切换实现解析
2019/09/12 Javascript
layui 解决富文本框form表单提交为空的问题
2019/10/26 Javascript
vue 对axios get pust put delete封装的实例代码
2020/01/05 Javascript
js实现简易点击切换显示或隐藏
2020/11/29 Javascript
Python基于win32ui模块创建弹出式菜单示例
2018/05/09 Python
python中的不可变数据类型与可变数据类型详解
2018/09/16 Python
在Pycharm中项目解释器与环境变量的设置方法
2018/10/29 Python
python 插入日期数据到Oracle实例
2020/03/02 Python
Pygame的程序开始示例代码
2020/05/07 Python
CSS3实现10种Loading效果
2016/07/11 HTML / CSS
中式结婚主持词
2014/03/14 职场文书
安全承诺书范文
2014/03/26 职场文书
求职自我评价范文100字
2014/09/23 职场文书
党员民主生活会整改措施
2014/09/26 职场文书
机关作风建设心得体会
2014/10/22 职场文书
教师个人发展总结
2015/02/11 职场文书
2015年乡镇残联工作总结
2015/05/13 职场文书
行政答辩状范文
2015/05/21 职场文书
MySQL 8.0 Online DDL快速加列的相关总结
2021/06/02 MySQL
Linux中Nginx的防盗链和优化的实现代码
2021/06/20 Servers
MySQL数据库查询进阶之多表查询详解
2022/04/08 MySQL