IE6就是坏，在编辑器里插入图片宽度和外层容器差不多，然后在同一行再输入点东西的话，前台页面就会完全乱套，用word-break:break-all;之类的CSS也不行。Firefox和IE7还比较好，知道自动换行自己调整一下。CSS我是调的很厌烦了，索性搞了个简单的图片缩放：
用法很简单，第一个参数就是图片所在的父级容器id，第二个是允许的图片宽度，默认是父级容器宽度的80%，第三个是图片高度，，默认是父级容器高度的80%。
要使用的话这样就好了：
JavaScript代码
- <script type="text/javascript">
- $(document).ready(function() {
- $.imgResize(‘blog_content’,600,480);
- });
- </script>
插件代码:
JavaScript代码
- /**
- * jquery image resize plugin.
- *
- * Copyright (c) 2009 Chengtian.Hu
- *chengtian.hu@gmail.com
- * http://www.yakelie.com
- *
- */
- /**
- * Resize all the images to a feat size.
- *
- * @parentItem the image container’s id
- * @maxWidth the max width of the image allow, if the image’s width larger than this size, the width of image will be resize. if this var is undefine, it will be replace by the container’s width*0.8.
- * @maxHeight the max height of the image allow, if the image’s height larger than this size, the height of image will be resize. if this var is undefine, it will be replace by the container’s height*0.8..
- */
- jQuery.imgResize = function(parentItem,maxWidth,maxHeight){
- if(maxWidth == undefined) maxWidth = $(’#‘+parentItem).width()*0.8;
- if(maxHeight == undefined) maxHeight = $(’#‘+parentItem).height()*0.8;
- $(’#’+parentItem).find("img").each(function(){
- if($(this).width()>0 && $(this).height()>0){
- var rate = (maxWidth/$(this).width() < maxHeight/$(this).height())?maxWidth/$(this).width():maxHeight/$(this).height();
- if(rate <= 1){
- $(this).width($(this).width()*rate);
- $(this).height($(this).height()*rate);
- }else{
- $(this).width($(this).width());
- $(this).height($(this).height());
- }
- }
- });
- }
最新评论