The picture element and associated features are W3C standard HTML features that allow web developers to deliver an appropriate image to every user depending on a variety of conditions like screen size, viewport size, screen resolution, and more. Picturefill is a JavaScript file (or a polyfill to be more specific) that enables support for the picture element and associated features in browsers that do not yet support them, so you can start using them today!
I am using picturefill.js library to pull up same image with different sizes on different width of screen.
Dilemma is that what should be the number of images should I create by keeping in mind of all mobile, tablet, desktop ?
By doing this I want…
Currently I'm working on building a solution for having responsive background images set via JavaScript. I am using Picturefill to create cross-browser support.
What do I need? There is an element on my page which needs a pretty little background…
I'm trying to use the element, which is created by the picturefill js library, inside of a web component I'm creating using Polymer, but it is choosing the smallest possible image as is not getting any dimensions from the…
Just some beginner's questions around the Picturefill polyfill:
I've noticed a short flicker in Firefox (33) and Safari (7.1) when I use a src attribute. These Browsers make an extra HTTP request. This is my code:
I have a site with a 12 column layout and I'm trying to figure out to use the srcset and sizes attributes correctly for matching my design.
I have a sidebox which spans 3 columns in desktop, but in tablet and mobile sizes it spans 12 cols (100%…
Iv`e created canvas pointer error. It shows a target to desired location (mouse position):
http://jsfiddle.net/conmute/rk276q3g/
The problem is in Firefox rendering, (move mouse very fast):
http://jsfiddle.net/conmute/rk276q3g/1/
rectangle acts…
I'm trying to combine Picturefill 2.1 with any available lazy load plugin, but I had no success yet. Most of the code I found on Google is for Picturefill 1.
Does anyone here has done this before and could help me? Picturefill is working just fine,…
I have some images in a large set of images that have a white (or black) border that surrounds the image itself. How can I...
Crop the image to a size without said background/border
Resize the image to fill a given output size centered.
For…
I've been working on an implementation of RoyalSlider and Picturefill, which has been working really well in all browsers. However, I've noticed that the latest Chrome Canary no longer adds the correct src attribute to an img tag when picturefill…
When using Picturefill 2 I'm getting layout jumping on images while the page is loading, for example, when you don't specify height on a normal image. Is this expected with Picturefill and is there a way around this problem? Thanks.
Here is a little sample:
http://cdpn.io/Gpdyx
It contains a PictireFill script from:
https://github.com/scottjehl/picturefill
and small jQuery code that tries to set same height of .copy element as the image height.
The problem is when PictureFill…