Удалить атрибуты высоты и ширины тега изображения

Невозможно удалить атрибуты изображения высоты или ширины с помощью опечатки.

Но вы можете переопределить его с помощью CSS, чтобы создать отзывчивый веб-сайт.

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

Вызов тега изображения в функции document.ready.

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

К вашему сведению: это невозможно удалить с помощью опечатки. Атрибуты width и height жестко запрограммированы в sysext/cms/tslib/class.tslib_content.php функции cImage. (Typo3 4.7)

Использовать jquery

установите идентификатор для вашего объекта изображения:

<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");

Это станет возможным в TYPO3 6.2 LTS. Оформить заказ http://forge.typo3.org/issues/49723.

Чтобы удалить эффекты атрибутов фиксированной ширины и / или высоты без фактического удаления этих атрибутов, вы можете вернуть им значение «авто» в определениях CSS:

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

Я предлагаю сделать это только для тегов img, где вам действительно нужно, чтобы изображения были плавными. Это можно сделать, добавив идентификатор или класс к тегам img или любому окружающему тегу.

Например. если ваши жидкие изображения расположены в div-оболочке с классом "fluid_pics", вы можете использовать:

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

Часто вам нужно будет только вернуть высоту автоматически, так как ширина уже перезаписана вашей структурой (например, Twitter Bootstrap) на 100%.

TypoScript для удаления атрибутов «ширина» и «высота» из исходного кода. 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
}

Если вашему изображению назначен id или другой уникальный атрибут, вы можете легко сделать это:

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

Для 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 для получения подробной информации о cObject IMAGE.

Есть решение для старых TYPO3 с TYPOSCRIPT:

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

Используйте этот stdWrap-TS там, где отображается ваше изображение.

он не работает в 6.1: /, но вы можете использовать CSS:

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

Это ОЧЕНЬ простое решение с jQuery. я нашел ответ на wpwizard.net.

Вот URL-адрес: 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>