代码之家 › 专栏 › 技术社区 › Trip

如何让ckeditor从hspace和vspace切换到正确的css

ckeditor wysiwyg ruby-on-rails javascript php

0

Trip · 技术社区 · 15 年前

我正在和Keckeditor合作,不管什么原因,他们的用户界面中都包含了hspace和vspace。方便的想法,允许用户操作他们的图像像这样,但这些方式是不赞成的。

是否有人将ckeditor的hspace和vspace转换为css,并知道如何解释其转换?

我是一个javascript新手……

2 回复 | 直到 15 年前

1

2

Charles 15 年前

hspace 和 vspace 是以像素为单位的边距。转换应该是直接、立即和简单的。

您希望在哪里进行更正?我对Keckeditor的来源一无所知,因此我提出了三个选择。

选项1:替换 水平间距 和 垂直间距 具有适当CSS的属性 在提交时 . 这可能会影响以后的可编辑性。

选项2:替换 水平间距 和 垂直间距 具有适当CSS的属性 在渲染时 . 如果使用正确的方法(HTML解析器),这可能会很慢。

选项3:替换 水平间距 和 垂直间距 具有适当CSS的属性 在客户方 在渲染时。在jquery、原型、moooltools或您正在使用的任何库中,这都应该是微不足道的。

jquery去营救!像这样的事情可以奏效。

$('img[hspace]').each(function(el){
    var pixels = parseInt($(el).attr('hspace'));
    if(isNaN(pixels) || pixels < 1)
        pixels = 0;
    else
        pixels = pixels / 2
    $(el).css('marginLeft', pixels + 'px')
         .css('marginRight', pixels + 'px')
         .removeAttr('hspace');
});

$('img[vspace]').each(function(el){
    var pixels = parseInt($(el).attr('vspace'));
    if(isNaN(pixels) || pixels < 1)
        pixels = 0;
    else
        pixels = pixels / 2
    $(el).css('marginTop', pixels + 'px')
         .css('marginBottom', pixels + 'px')
         .removeAttr('vspace');
});

2

1

AlfonsoML 15 年前

你用的是什么版本的键盘编辑器? 负载 http://ckeditor.com/demo 并查看为该图像生成的源: 风格= 左边距:10px;右边距:10px; 浮动:左;宽度:120px;高度:168px;“所以你不必做任何事情。