有时候我们需要定义一个正方形的块里面放入一张图,要么就是图片显示不全,要么就是图片失真,这个大家都遇到过吧。这里我们将彻底解决这个问题,图片的宽度和高度随便定义且不失真,不妨大家一试。
首页 /  web前端 /  JavaScript / js图片自适应div大小插件图片且不失真且显示图片主要部份

0 1 639

js图片自适应div大小插件图片且不失真且显示图片主要部份

有时候我们需要定义一个正方形的块里面放入一张图,要么就是图片显示不全,要么就是图片失真,这个大家都遇到过吧。这里我们将彻底解决这个问题,图片的宽度和高度随便定义且不失真,不妨大家一试。

js图片自适应div大小插件图片且不失真且显示图片主要部份_图一

主要js

<script type="text/javascript" src="image-adapter.js"></script>

1.直接写html加个class名字就行

<img class="img-adapter" src="123.jpg"/></a>

2.如果是通过ajax动态加载的图片那么就要调用如下的ajax_call()函数

jQuery.get('data.php', function(datas){
		var str = '';
		for(i in datas){
			var imgurl = datas[i];
			str = str + '<a><img class="img-adapter" src="'+imgurl+'"/></a>';
		}
		jQuery(".main").html(str);
		ajax_call();
    },"json");
下载所需:5 金币 下载 演示

[来源] http://yuanmouren.erlyun.com/p.php?id=25

[声明] 本站资源来自用户分享,如损害你的权益请联系客服QQ:120074275给予处理。

容若 2017-09-18 18:15
10
送花
20积分一朵