zafree / pilpil Goto Github PK
View Code? Open in Web Editor NEWPilpil - Progressive Image Loading
Home Page: https://zafree.github.io/pilpil
License: MIT License
pilpil's People
Contributors
Stargazers
Watchers
Forkers
ashawkat infoshahin sweetsojib srizon m4mohaiman mdshams rakib07 zahiruldu zisuzon masumbill al-mamun pandahisham zkovalenko2 groe shahriar1824 javascript-resource openainext shuvojit33 marwenhlaoui mtayyabhanif nahid kis25791 eliements otobelikethee mmarj vmeli gautamnaik1994 drasya tuantmtb mailightkun antflux lobzik76 nayeemch frickreich iq-scm tareq89pilpil's Issues
Adding New Feature
Hi,
without any formality, i just want to say that ...like you said on description "as seen on Medium."
Unlike this library, the images on Medium's website loads only when user scroll up on them.
On this library, the images first show the blur-canvas and after that the full-size image loads,
but it doesn't speeds up the loading time because the original image also start loading right after the smaller one finished.
I hope you get my point.
what are your thoughts on this? :) ^_^
P.S Sorry for my bad English
Works only for visible images
For images that are not visible when the script executes (i.e. their parent elements are hidden via CSS), the max-width and max-height attributes of the ratio placeholder are set to 0 permanently (because offset<Width|Height> are 0 at that time). This results in images permanently being hidden even when their parent container is made visible at some later point.
A typical scenario for this would be image sliders or carousels where only one image is visible at a time. It would be great if pilpil could support this kind of scenario.
A possible solution would be to offer a global method that users of the library can call to recompute widths and heights.
Btw: Really great work!
Setting the width & height automatically inherit its parent?
id like to ask, how to make the original width and height set inherit to their respective parent? i mean iwouldnt have to put the data attribute anymore, it automatically inherit by its parent
Great plugin, thanks
Does not work if the DOM has not been parsed yet
When I include the <script> in the <head> of a page, it's not working because it executes before the DOM has been parsed ompletely (document.querySelectorAll('.progressiveMedia') returns an empty array).
With jquery this could easily be handled with $(document).ready(...). In plain JS it seems to be trickier though.
Apply Source code in JSbin
Hello!
I have downloaded the source code and it doesn't work when I follow the instructions about how to use the Pilpil
Is it possible to upload the source code to the "http://jsbin.com/"? Is is easier to understand how the sourcecode is built.
Thank you!
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.