在使用UEditor等HTML编辑器时，若文章中图片大小超过元素给定的尺寸，则图片显示时会超出元素范围，使页面的排版出现混乱，这时可使用jQuery对文章中的图片和显示方式进行处理，以控制图片的显示大小和出现的方式。

以下为jQuery的JS文件和jQuery UI的引入文件。
[html] 
<link rel="stylesheet" type="text/css" href="css/custom-theme/jquery-ui-1.8.23.custom.css"/> 
<script type="text/javascript" src="js/jquery-1.8.0.min.js"></script> 
<script type="text/javascript" src="js/jquery-ui-1.8.23.custom.min.js"></script> 

以下为用于对文件中图片显示所使用的层
[html]
<div id="picDlg" title="图片查看" style="display:none;"></div> 

以下为控制图片显示和运用效果的代码
[html] 
$(".bodyLeft img").load(function(){ 
    w=$(this).width(); 
    h=$(this).height(); 
    t=$(this).attr("title"); 
    src=$(this).attr("src"); 
    $(this).width(w>400?400:w); 
    $(this).height(w>400?(400/w)*h:h); 
    $(this).css("cursor","pointer"); 
    $(this).click(function(){ 
        $("#picDlg").html("<img src="+src+" border=0/>").fadeIn(1000).dialog({ 
            width:"auto", 
            height:"auto", 
            title:t, 
            modal:true, 
            draggable:false, 
            resizable:false 
        }) 
    }) 
})