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

Question

Для того, чтобы создать адаптивный сайт с Typo3 и Twitter Bootstrap, я хотел бы, чтобы удалить высота и ширина attributs изображений

Вот как изображения генерируются в фронтэнда с помощью элемента содержимого типа текста & изображений и изображений

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

Я хотел бы, чтобы удалить атрибуты измерения и получить это:

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

Может кто-нибудь мне помочь?

Answer 1

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

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

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

Answer 2

Использование 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"); 

Answer 3

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

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

Answer 4

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

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

Answer 5

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

Answer 6

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

Answer 7

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

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

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

E.g. если ваши жидкости изображения расположены в оберточную DIV с «fluid_pics» класса вы можете использовать:

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

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

Answer 8

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 
} 

Answer 9

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

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

Answer 10

для 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 11

Это ОЧЕНЬ простое решение с 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> 

Answer 12

Существует решение для старых TYPO3s с TypoScript:

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

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