TYPO3 <f: image /> вкладывает viewhelper или использует обработанное изображение как-нибудь для lazyload

Я пытаюсь использовать lazyload с помощью определенного ползунка, он запрашивает ввод src изображения дважды, один раз как src, а второй как data-lazy, например:

<img src="domain.com/image.png" data-lazy="domain.com/image.png">

с <f:image /> я могу использовать data="{lazy: 'domain.com/image.png'}" и должен повторить src изображения, созданного с помощью viewhelper ... ( документация typo3 и встроенное использование f:uri.image)

у меня на самом деле два вопроса:

  • как мне вложить f:uri.image? это дает ошибку <f:image src="{image.uid}" treatIdAsReference="1" data="{lazy: '{f:uri.image(src: {image.uid})}'}"/>
  • на самом деле это должна быть ссылка на то же изображение, если я вложу f:uri.image, создам ли я второе изображение? (особенно потому, что я также установил ширину и высоту, но я хотел, чтобы фрагменты были простыми)

решение должно работать для TYPO3 v7 и v8

2 ответа

Решение

Попробуй это

<img src="{f:uri.image(src : image.uid)}" data-lazy="{f:uri.image(src : image.uid)}" />

Вам не нужно использовать <f:image ..> тег для создания возвращает тот же обработанный ресурс.

В цикле:

<f:for each="{MARKER}" as="file">
<img class="lazy" src=".../blank.gif" data-lazy="{f:uri.image(image: file, width:'XXXc', height:'XXXc', treatIdAsReference:1)}" alt="{file.alternative}" title="{file.title}">
</f:for>
Другие вопросы по тегам