首页 > 编程 > JavaScript > 正文

基于jquery的文章中所有图片width大小批量设置方法

2019-11-20 22:28:50
字体:
来源:转载
供稿:网友

前面要加载一个jquery库。

<script type="text/javascript"> var setNewsImg = function(obj){ $(obj).find('img').each(function(i){ var imgw = $(this).width(); var imgh = $(this).height(); var scale=1; if(imgw>634){ scale = 634/imgw; console.log(scale); $(this).height(scale*imgh); $(this).width(scale*imgw); } }); } </script type="text/javascripy"> 调用 <script> $(function(){ setNewsImg('.news-img') }) </script> 

代码二:

$(window).bind("load", function() {  // 图片修改大小  $('#imglist img').each(function() {   var maxWidth = 120; //初始化最大显示宽度  var maxHeight = 120; //初始化最大显示高度  var ratio = 0;   var width = $(this).width();   var height = $(this).height();     if(width > maxWidth){    ratio = maxWidth / width;    $(this).css("width", maxWidth);    $(this).css("height", height * ratio);    height = height * ratio;   }     if(height > maxHeight){    ratio = maxHeight / height;    $(this).css("height", maxHeight);    $(this).css("width", width * ratio);    width = width * ratio;   }  }); });

代码三:

<script>$(function(){$(".daima img").each(function(){maxWidth =700;ratio = 0;width = $(this).width();height = $(this).height();if(width > maxWidth){ratio = maxWidth / width;$(this).width(maxWidth);height = height * ratio;$(this).height(parseInt(height));}});});</script>

代码四: 推荐使用

$('#content').find('img').each(function(){    var img = this;    if (img.width > 600) {      img.style.width = "600px";      img.style.height = "auto";      //$(img).removeAttr('height');      var aTag = document.createElement('a');      aTag.href = img.src;			aTag.target="_blank";      $(aTag).addClass('bPic')      .insertAfter(img).append(img)      .lightBox(options);    }  });

这个content就是文章内容部分的id,方便控制制定位置的图片大小,推荐使用。

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表