Project

General

Profile

Actions

Feature #49723

closed

Improve rendering of responsive images

Added by Georg Ringer almost 11 years ago. Updated over 5 years ago.

Status:
Closed
Priority:
Should have
Assignee:
-
Category:
-
Target version:
-
Start date:
2013-07-06
Due date:
% Done:

100%

Estimated time:
(Total: 0.00 h)
PHP Version:
Tags:
Complexity:
Sprint Focus:

Description

There are some tasks which could be improved when responsives images should be rendered:

  • Don't output width/height tag in img tag
  • Improved option for setting multiple sources

possible variants

http://responsejs.com/
<img src="lo-fi.png" data-min-device-width-641="hi-fi.png" alt="example" />
<img src="image.jpg" alt="" data-src-600px="image-600px.jpg">

Support srcset

<img alt="The Breakfast Combo" src="banner.jpeg" 
   srcset="banner-HD.jpeg 2x, banner-phone.jpeg 100w,
   banner-phone-HD.jpeg 100w 2x">

picture tag

<picture width="500" height="500">
  <source src="large.jpg"  media="(min-width: 45em)">
  <source src="middle.jpg" media="(min-width: 18em)">
  <img src="small.jpg" alt="">
  <p>Accessible text</p>
</picture>

Subtasks 1 (0 open1 closed)

Feature #49725: Make rendering image dimensions configurableRejected2013-07-06

Actions

Related issues 1 (0 open1 closed)

Related to TYPO3 Core - Feature #50075: Responsive Image Rendering Closed2013-07-16

Actions
Actions #1

Updated by Gerrit Code Review almost 11 years ago

  • Status changed from New to Under Review

Patch set 1 for branch master has been pushed to the review server.
It is available at https://review.typo3.org/22052

Actions #2

Updated by Gerrit Code Review almost 11 years ago

Patch set 2 for branch master has been pushed to the review server.
It is available at https://review.typo3.org/22052

Actions #3

Updated by Gerrit Code Review almost 11 years ago

Patch set 3 for branch master has been pushed to the review server.
It is available at https://review.typo3.org/22052

Actions #4

Updated by Gerrit Code Review almost 11 years ago

Patch set 4 for branch master has been pushed to the review server.
It is available at https://review.typo3.org/22052

Actions #5

Updated by Martin Ficzel almost 11 years ago

Some example TypoScript

page.30 = IMAGE
page.30 { 
  file = fileadmin/oskar.jpg
  file.width = 100

  layoutKey = default  
  layout {

    default {
     element = <img src="###SRC###" width="###WIDTH###" height="###HEIGHT###" ###PARAMS### ###ALTPARAMS### ###BORDER### />
     source = 
    }

    srcset {
      element = <img src="###SRC###" srcset="###SOURCECOLLECTION###" ###PARAMS### ###ALTPARAMS### />
      source = |*|###SRC### ###SRCSETCANDIDATE###,|*|###SRC### ###SRCSETCANDIDATE###
    }

    picture {
      element = <picture>###SOURCECOLLECTION###<img src="###SRC###" ###PARAMS### ###ALTPARAMS### /></picture>
      source = <source src="###SRC###" media="###MEDIAQUERY###" />
    }

    data {
      element = <img src="###SRC###" ###SOURCECOLLECTION### ###PARAMS### ###ALTPARAMS### />
      source = data-###DATAKEY###="###SRC###" 
    }
  }

  sourceCollection {
    small {
      width = 200

      srcsetCandidate = 800w
      mediaQuery = (min-device-width: 800px)
      dataKey = small
    }
    smallHires {
      width = 300
      pixelDensity = 2

      srcsetCandidate = 800w 2x
      mediaQuery = (min-device-width: 800px) AND (foobar)
      dataKey = smallHires
      pictureFoo = bar
    }
  }
}
page.40 < page.30 page.40.layoutKey = data
page.50 < page.30 page.50.layoutKey = picture
page.60 < page.30 page.60.layoutKey = srcset
Actions #6

Updated by Gerrit Code Review almost 11 years ago

Patch set 5 for branch master has been pushed to the review server.
It is available at https://review.typo3.org/22052

Actions #7

Updated by Gerrit Code Review almost 11 years ago

Patch set 6 for branch master has been pushed to the review server.
It is available at https://review.typo3.org/22052

Actions #8

Updated by Gerrit Code Review almost 11 years ago

Patch set 7 for branch master has been pushed to the review server.
It is available at https://review.typo3.org/22052

Actions #9

Updated by Gerrit Code Review almost 11 years ago

Patch set 8 for branch master has been pushed to the review server.
It is available at https://review.typo3.org/22052

Actions #10

Updated by Gerrit Code Review almost 11 years ago

Patch set 9 for branch master has been pushed to the review server.
It is available at https://review.typo3.org/22052

Actions #11

Updated by Gerrit Code Review over 10 years ago

Patch set 10 for branch master has been pushed to the review server.
It is available at https://review.typo3.org/22052

Actions #12

Updated by Gerrit Code Review over 10 years ago

Patch set 11 for branch master has been pushed to the review server.
It is available at https://review.typo3.org/22052

Actions #13

Updated by Gerrit Code Review over 10 years ago

Patch set 12 for branch master has been pushed to the review server.
It is available at https://review.typo3.org/22052

Actions #14

Updated by Gerrit Code Review over 10 years ago

Patch set 13 for branch master has been pushed to the review server.
It is available at https://review.typo3.org/22052

Actions #15

Updated by Gerrit Code Review over 10 years ago

Patch set 14 for branch master has been pushed to the review server.
It is available at https://review.typo3.org/22052

Actions #16

Updated by Gerrit Code Review over 10 years ago

Patch set 15 for branch master has been pushed to the review server.
It is available at https://review.typo3.org/22052

Actions #17

Updated by Gerrit Code Review over 10 years ago

Patch set 16 for branch master has been pushed to the review server.
It is available at https://review.typo3.org/22052

Actions #18

Updated by Gerrit Code Review over 10 years ago

Patch set 17 for branch master has been pushed to the review server.
It is available at https://review.typo3.org/22052

Actions #19

Updated by Gerrit Code Review over 10 years ago

Patch set 18 for branch master has been pushed to the review server.
It is available at https://review.typo3.org/22052

Actions #20

Updated by Gerrit Code Review over 10 years ago

Patch set 19 for branch master has been pushed to the review server.
It is available at https://review.typo3.org/22052

Actions #21

Updated by Gerrit Code Review over 10 years ago

Patch set 20 for branch master has been pushed to the review server.
It is available at https://review.typo3.org/22052

Actions #22

Updated by Gerrit Code Review over 10 years ago

Patch set 21 for branch master has been pushed to the review server.
It is available at https://review.typo3.org/22052

Actions #23

Updated by Gerrit Code Review over 10 years ago

Patch set 22 for branch master has been pushed to the review server.
It is available at https://review.typo3.org/22052

Actions #24

Updated by Gerrit Code Review over 10 years ago

Patch set 23 for branch master has been pushed to the review server.
It is available at https://review.typo3.org/22052

Actions #25

Updated by Gerrit Code Review over 10 years ago

Patch set 24 for branch master has been pushed to the review server.
It is available at https://review.typo3.org/22052

Actions #26

Updated by Gerrit Code Review over 10 years ago

Patch set 25 for branch master has been pushed to the review server.
It is available at https://review.typo3.org/22052

Actions #27

Updated by Gerrit Code Review over 10 years ago

Patch set 26 for branch master has been pushed to the review server.
It is available at https://review.typo3.org/22052

Actions #28

Updated by Gerrit Code Review over 10 years ago

Patch set 27 for branch master has been pushed to the review server.
It is available at https://review.typo3.org/22052

Actions #29

Updated by Gerrit Code Review over 10 years ago

Patch set 28 for branch master has been pushed to the review server.
It is available at https://review.typo3.org/22052

Actions #30

Updated by Gerrit Code Review over 10 years ago

Patch set 29 for branch master has been pushed to the review server.
It is available at https://review.typo3.org/22052

Actions #31

Updated by Gerrit Code Review over 10 years ago

Patch set 30 for branch master has been pushed to the review server.
It is available at https://review.typo3.org/22052

Actions #32

Updated by Gerrit Code Review over 10 years ago

Patch set 31 for branch master has been pushed to the review server.
It is available at https://review.typo3.org/22052

Actions #33

Updated by Anonymous over 10 years ago

  • Status changed from Under Review to Resolved
Actions #34

Updated by Gerrit Code Review over 10 years ago

  • Status changed from Resolved to Under Review

Patch set 1 for branch master has been pushed to the review server.
It is available at https://review.typo3.org/24525

Actions #35

Updated by Christian Kuhn over 10 years ago

  • Status changed from Under Review to Resolved
Actions #36

Updated by Benni Mack over 5 years ago

  • Status changed from Resolved to Closed
Actions

Also available in: Atom PDF