Question

要创建包含Typo3和Twitter Bootstrap的自适应网站，我想删除图片 height 和 width attributs < / p>

以下是通过 text＆amp;类型的内容元素在前端生成图像的方式。图像和图像

<img src="typo3temp/pics/a625b79f89.jpg" width="300" height="226" alt="blabla" />

我想删除维度属性并获取此内容：

<img src="typo3temp/pics/a625b79f89.jpg" alt="blaba" />

任何人都可以帮助我吗？

Answer 1

在document.ready函数中调用图像标记。

$('img').removeAttr('width').removeAttr('height');

Answer 2

仅供参考：没有办法用typoscript删除它。 width和height属性在sysext/cms/tslib/class.tslib_content.php函数cImage中进行了硬编码。（Typo3 4.7）

Answer 3

TYPO3 6.2 LTS可以实现这一点。结帐http://forge.typo3.org/issues/49723。

Answer 4

无法使用typoscript删除高度或宽度图像属性。

但您可以使用CSS覆盖它以创建响应式网站。

img { height:100% !important; width:100% !important; }

Answer 5

使用jquery

为您的图片对象设置ID：

<img src="typo3temp/pics/a625b79f89.jpg" width="300" height="226" alt="blabla" id="myimage" />

$('#myimage').removeAttr("heigth").removeAttr("width");

这里是替代的javascript代码：

var myImage= document.getElementById("myimage");
myImage.removeAttribute("heigth");
myImage.removeAttribute("width");

Answer 6

要删除固定宽度和/或高度属性的效果而不实际删除这些属性，可以在CSS定义中将它们设置回“auto”：

img {
    height: auto !important;
    width: auto !important;
}

我建议只对img标签这样做，你真的需要图片流畅。这可以通过向img标签或任何周围标签添加id或类来完成。

E.g。如果流体图像位于包含“fluid_pics”类的包装div中，则可以使用：

.fluid_pics img {
    height: auto !important;
    width: auto !important;
}

通常你只需要将高度设置回auto，因为你的框架已经覆盖了宽度100％（例如Twitter Bootstrap）。

Answer 7

删除TypoScript＆＃34;宽度＆＃34;和＆＃34;身高＆＃34;来自源代码的属性。 TYPO3 CMS 6.1 +。

tt_content.image.20.stdWrap.parseFunc.nonTypoTagStdWrap.HTMLparser.tags.img.fixAttrib {
width.unset = 1
height.unset = 1
border.unset = 1
}

tt_content.textpic.20.stdWrap.parseFunc.nonTypoTagStdWrap.HTMLparser.tags.img.fixAttrib {
width.unset = 1
height.unset = 1
border.unset = 1
}

lib.parseFunc_RTE.nonTypoTagStdWrap.HTMLparser.tags.img.fixAttrib {
width.unset = 1
height.unset = 1
border.unset = 1
}

tt_news示例：新闻列表

plugin.tt_news.displayList.image.stdWrap.parseFunc.nonTypoTagStdWrap.HTMLparser.tags.img.fixAttrib {
width.unset = 1
height.unset = 1
border.unset = 1
}

Answer 8

如果您的图片分配了id或其他唯一属性，则可以轻松执行此操作：

var myImg=document.getElementById('myImage');
myImg && myImg.removeAttribute('height') && myImg.removeAttribute('width');

Answer 9

对于Typo3 6.2以上，您可以设置自定义图像渲染布局（代码段属于TS设置）：

tt_content.image.20.1 {
    layout {
        mylayout {
            # equals default rendering, except width and height removed
            element = <img src="###SRC###" ###PARAMS### ###ALTPARAMS### ###BORDER### ###SELFCLOSINGTAGSLASH###>
        }
    }
}

为css_styled_content启用自定义布局（代码段属于TS常量）：

styles.content.imgtext.layoutKey = mylayout

参见https://docs.typo3.org/typo3cms/TyposcriptReference/ContentObjects/Image/Index.html#cobj-image-layoutkey 有关IMAGE cObject的详细信息。

Answer 10

旧TYPO3的解决方案有TYPOSCRIPT：

stdWrap {
    replacement {
        10 {
            search = /\s+(width|height)="[^"]+"/
            useRegExp = 1
            replace =
        }
    }
}

使用此stdWrap-TS渲染图像。

Answer 11

它在6.1中不起作用：/ 但你可以使用CSS：

img {
    display: block;
    max-width: 100%;
    height: auto;
}

Answer 12

这是一个非常简单的jQuery解决方案。我在wpwizard.net找到了答案。

这是网址： http://wpwizard.net/jquery/remove-img-height-and-width-with-jquery/

这是jQuery：

<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
jQuery.noConflict();
jQuery(document).ready(function($){

    $('img').each(function(){ 
        $(this).removeAttr('width')
        $(this).removeAttr('height');
    });

});
</script>

删除图像标记的属性“高度”和“宽度”

12 个答案: