`
huibin
  • 浏览: 757110 次
  • 性别: Icon_minigender_1
  • 来自: 郑州
社区版块
存档分类
最新评论

fck 限制上传图片的宽度

阅读更多

修改 fckeditor\editor\dialog\fck_image 路径下的 fck_image.js 文件

 

1、找到UpdateOriginal方法

function UpdateOriginal(resetSize ){
	
	if ( !eImgPreview )
		return ;

	if ( GetE('txtUrl').value.length == 0 ){
		oImageOriginal = null ;
		return ;
	}

	oImageOriginal = document.createElement( 'IMG' ) ;// new Image() ;
//以上为添加代码
 oImageOriginal.onload = function(){
        if(GetE('txtWidth').value.length==0){
      GetE('txtWidth').value=oImageOriginal.width;
      }
        if(GetE('txtWidth').value>800){
    GetE('txtWidth').value =800;  
    var imgHeight=800 * oImageOriginal.height / oImageOriginal.width;
    GetE('txtHeight').value =imgHeight;
   }
 }
//以上为添加代码
if ( resetSize ){
		oImageOriginal.onload = function(){
			this.onload = null ;
			ResetSizes();
		}
	}

	oImageOriginal.src = eImgPreview.src ;
}

 2、找到OnSizeChanged方法

function OnSizeChanged( dimension, value )
{  
	// Verifies if the aspect ration has to be maintained
	if ( oImageOriginal && bLockRatio )
	{
		var e = dimension == 'Width' ? GetE('txtHeight') : GetE('txtWidth') ;

		if ( value.length == 0 || isNaN( value ) )
		{
			e.value = '' ;
			return ;
		}

		if ( dimension == 'Width' )
			value = value == 0 ? 0 : Math.round( oImageOriginal.height * ( value  / oImageOriginal.width ) ) ;
		else
			value = value == 0 ? 0 : Math.round( oImageOriginal.width  * ( value / oImageOriginal.height ) ) ;

		if ( !isNaN( value ) )
			e.value = value ;

              if(GetE('txtWidth').value>800){
		  var imgWidth=800;
		  var imgHeight=800 * oImageOriginal.height / oImageOriginal.width;
		  GetE('txtWidth').value =imgWidth;        	 
		  GetE('txtHeight').value =imgHeight;
	      }
	}
 	
	UpdatePreview() ;
}

 3、找到ResetSizes方法

function ResetSizes()
{
	if ( ! oImageOriginal ) return ;
	if ( oEditor.FCKBrowserInfo.IsGecko && !oImageOriginal.complete )
	{
		setTimeout( ResetSizes, 50 ) ;
		return ;
	}

	//GetE('txtWidth').value  = oImageOriginal.width ;
	//GetE('txtHeight').value = oImageOriginal.height ;
	if ( oImageOriginal.width<800) { 
		   GetE('txtWidth').value=oImageOriginal.width ; 
		   GetE('txtHeight').value=oImageOriginal.height ; 
   	     } else { 
		   GetE('txtWidth').value=800; 
		   GetE('txtHeight').value=800*oImageOriginal.height/oImageOriginal.width ; 
	   }
	UpdatePreview() ;
}

 

以上红色的为添加的代码,蓝色的为删除的代码,修改后涮洗浏览器,就可以看到效果。

 

分享到:
评论

相关推荐

    FCk上传图片和文案

    这个名为"FCk上传图片和文案"的资源显然与使用FCKeditor在JSP(JavaServer Pages)环境中实现图片和文档上传的功能有关。下面我们将深入探讨这个主题。 FCKeditor是一个开源的JavaScript组件,它允许用户在网页上...

    FCK添加上传视频插件

    "FCK添加上传视频插件"这个主题,主要是关于如何在FCKeditor中集成视频上传功能,使得用户可以像上传图片一样方便地上传和插入视频到编辑内容中。接下来,我们将详细探讨这个过程及其涉及的技术点。 首先,...

    fck编辑器(调整工具栏,下拉宽度)

    如果你遇到“不会上传,浏览文件发生错误...”的问题,可能是因为服务器权限设置不正确、网络问题或者是浏览器限制。确保你有正确的文件访问权限,并且网络连接稳定。如果是在本地开发环境中,检查编辑器的文件路径...

    FCK编辑器 asp版 精简无错

    4. **配置路径**:根据FCKeditor的结构,配置图片、文件上传的保存路径以及皮肤、语言等资源的路径。 5. **测试运行**:保存并上传修改后的ASP页面,通过浏览器访问以测试编辑器是否正常工作。 **文件列表** 1. **...

    Fck 编辑器 实例

    **FCK编辑器详解** FCKeditor是一款开源的在线文本编辑器,专为网页设计者和开发者提供方便。它允许用户在网页上直接编辑内容,就像在Word文档中一样,而无需了解HTML代码。FCKeditor支持多种浏览器,包括Internet ...

    fckeditor 在java中的配置及图片的上传

    此外,还应限制上传文件的大小和类型,避免服务器资源被滥用。 通过以上步骤,你就可以在Java项目中成功地配置和使用FCKeditor,实现富文本编辑和图片上传功能。记住,良好的代码组织和安全性实践是项目成功的关键...

    mvc下富文本编辑器fck fckeditor使用代码

    - 对上传的图片进行大小限制和格式检查,避免服务器被大文件拖垮或者不安全的文件类型被执行。 通过以上步骤,你可以在ASP.NET MVC应用中成功集成并使用FCKeditor富文本编辑器,实现用户友好的内容编辑和图片上传...

    FCK编辑器(已配置好)

    对于文件上传,应限制可接受的文件类型和大小,避免服务器被恶意文件占用。 **总结** FCKeditor是一个强大的富文本编辑器,对于ASP.NET开发者来说,它简化了内容编辑界面的开发。预配置好的版本消除了很多集成和...

    FCK相关用法111111111111

    例如,添加一个上传图片的按钮,需要编写相应的插件并集成到编辑器中。 4. **服务器端集成**:FCKeditor处理的内容通常需要在服务器端进行进一步的处理,例如保存到数据库或生成HTML文件。这需要在服务器端实现接收...

    fck在线文本编辑器

    此外,可以自定义上传文件的类型和大小限制。 **五、扩展和定制** FCKeditor提供了丰富的API和插件机制,允许开发者根据需求进行扩展和定制。例如,可以添加自定义的工具栏按钮,或者修改编辑器的行为。 **六、...

    fck实现htm在线编辑

    此外,对于图片上传,需限制文件类型和大小,防止上传恶意文件。 六、与后端集成 FCKeditor与后端系统的集成通常是通过AJAX或表单提交实现的。在用户完成编辑并点击“保存”按钮时,编辑器的内容会被发送到服务器端...

    Aspnet fck_ediotr使用及示例

    1. **图片上传问题**:FCKeditor支持图片上传,但需要正确配置服务器端的上传处理程序,确保安全性和文件大小限制。 2. **兼容性问题**:尽管FCKeditor支持多种浏览器,但在不同版本或不同平台的浏览器中可能表现不...

    在Lotus中嵌入Fckeditor上传代码

    4. **安全性和权限控制**:在实现上传功能时,需要考虑安全因素,比如限制上传文件的类型和大小,防止恶意文件的上传。此外,还需要确保只有授权用户才能访问和上传文件。 5. **测试和优化**:完成上述步骤后,进行...

    FCK使用配置

    ### FCKeditor在Java环境下的配置使用指南 ...例如,可以通过修改`web.xml`中的配置来限制用户上传的文件类型、大小等。此外,也可以根据实际需求选择性地启用某些特性或插件,以提高编辑器的灵活性和易用性。

    jsp在线图文编辑器

    fck-demo允许开发者根据需求进行个性化配置,比如调整工具栏布局、设定默认字体大小和颜色、限制编辑区域的宽度和高度等。这些配置通常通过修改配置文件或者在初始化时传递参数实现。 5. **安全考虑** 在使用fck-...

    fckeditor2.6.3 for php

    同时,为了安全考虑,应限制上传文件的类型和大小,防止恶意文件上传。 总结,FCKeditor 2.6.3 for PHP是一款实用的富文本编辑工具,通过合理的配置和使用,能够极大地提升Web应用中的文本编辑体验。通过学习提供的...

    fckeditor2.6.4 java配置好的项目下载

    1. 为了安全起见,建议限制FCKeditor上传文件的类型和大小。 2. 如果遇到跨域问题,可能需要配置CORS策略或者在服务器端处理请求头。 3. 对于大型项目,可以考虑使用更新版本的富文本编辑器,如CKEditor,它继承自...

    PHP爱好者留言板 v2.0.rar

    同时增加宽度设置,用户可以调整留言板的宽度以符合网站需要 增加界面语言设置,用户可以修改界面语言包,使之符合自己的需求 增加头像设置,用户可以上传,删除,修改头像 把头像的选择方式从下拉菜单改成全部...

    FCKEditor编辑

    4. 部署到生产环境时,要考虑文件上传的安全性,例如限制文件类型、大小等。 综上所述,FCKEditor作为一款功能强大的富文本编辑器,能够极大地提升Web应用中的文本编辑体验。通过合理集成和配置,开发者可以在C# ...

    FCKeditor && fckeditor.properties

    3. **安全选项**:这里可以设置安全策略,比如限制可编辑的HTML标签,防止XSS攻击,或者限制上传文件的类型和大小,确保网站安全。 4. **编辑器样式**:可以通过配置文件来改变编辑器的外观,比如字体大小、颜色、...

Global site tag (gtag.js) - Google Analytics