2016-10-13 00:16:48 点击量:68 标签: 收藏本文
[JS]js实现图片img宽度超出后自动缩小的源代码
- <script type="text/javascript" src="js/jquery.min.js"></script>
- <script type="text/javascript">
- jQuery.fn.LoadImage=function(scaling,width,height,loadpic){
- if(loadpic==null)loadpic="../img/loading.gif";
- return this.each(function(){
- var t=$(this);
- var src=$(this).attr("src")
- var img=new Image();
- img.src=src;
- //酷播cuplayer.com自动缩放图片
- var autoScaling=function(){
- if(scaling){
- if(img.width>0 && img.height>0){
- if(img.width/img.height>=width/height){
- if(img.width>width){
- t.width(width);
- t.height((img.height*width)/img.width);
- }else{
- t.width(img.width);
- t.height(img.height);
- }
- }
- else{
- if(img.height>height){
- t.height(height);
- t.width((img.width*height)/img.height);
- }else{
- t.width(img.width);
- t.height(img.height);
- }
- }
- }
- }
- }
- //酷播cuplayer.com处理ff下会自动读取缓存图片
- if(img.complete){
- autoScaling();
- return;
- }
- $(this).attr("src","");
- var loading=$("<img alt=\"酷播cuplayer.com加载中...\" title=\"图片加载中...\" src=\""+loadpic+"\" />");
- t.hide();
- t.after(loading);
- $(img).load(function(){
- autoScaling();
- loading.remove();
- t.attr("src",this.src);
- t.show();
- });
- } );
- }
- </script>
- <div id="content"><img src="img/20120518073933709.jpg"/></div>
- <script type="text/javascript">
- <!--
- $(window).load(function(){
- $('#content img').LoadImage(true, 600,500,'img/loading.gif');
- });
- //-->
- </script>
我们是一家提供综合软件外包与弱电工程服务的技术公司。
业务涵盖定制软件、管理系统、网站、小程序、APP、系统集成、网络布线、监控安防、门禁、机房建设及长期技术维护。
公司地址:湖北省宜昌市伍家岗区东站二路6号三峡(宜昌)大数据产业园海洋馆二楼A203室