Comments (5)
can you add imgStyle
: { transition: '0s' }? if you don't want animation, curious to know the reason too.
from react-simple-img.
First, my appologies for not submitting a nice bug report. I'm bad at CSS and the complex CSS I have is no longer supported so my changes are painful. My hope was to just replace my img tags with your SimpleImg tag. It did work well on my speakers and sessions but not so much on sponsors. When I inspect the html and compare it pre and post SimpleImg, there is a div added that I think is hurting my formatting.
If you look at this page near the bottom https://svcc.mobi/
, you'll see a tab dialog that shows "Gold & Platinum" and "All The Sponsors". They basically show the same formatting. "Gold & Platinum" format as I would expect (flowing across the screen), and "All the sponsors" has the imaged forced to one image per row. The only difference is "All the sponsors" uses the SimpleImg tag (and I had to add width and height of 200 but now sure why).
Again, my hope was I could just drop in the SimpleImg tag and the formatting would not change.
Make sense? I can explain further if this is not clear.
BTW, thanks for putting this together. Very nice !
from react-simple-img.
i see @pkellner can you try to use placeholder={false}
in SimpleImfg, see if that solve your layout issue.
from react-simple-img.
That worked! Thanks. I had tried it before, but I read that placeholder is a string so I passed it as placeholder={"false"}
and I'm pretty sure that did not help me. I use TypeScript and I don't there there is a type file that would have helped me. Again, something I wish I knew more about.
Thanks again for the help, your contributions, and this awesome project.
from react-simple-img.
that's great to hear! thank you :) close the issue when you ready 👍
from react-simple-img.
Related Issues (20)
- TypeError: placeholder.indexOf is not a function HOT 5
- Number.isNaN not supported in IE11 HOT 3
- Image can't be loaded on FireFox HOT 7
- Support for SEO (no script tag) HOT 9
- Inline CSS is stretching images HOT 14
- Image src not updated when component rerenders HOT 4
- Fallback/default img when img url is not valid HOT 7
- Add browser support to README HOT 9
- Using webp images with <picture> and multiple source sets? HOT 2
- Typescript types generated ? HOT 2
- disableAnimationAfterCache does not exist in source code HOT 1
- Height and width not accepting % HOT 1
- When Running Docker on LocalHost, Image Always Behind White Background HOT 2
- threshold doesn't take in account scrolling down HOT 5
- Invalid empty srcSet attribute in SSR HOT 6
- Placeholder does not have `alt` attribute HOT 2
- not showing img after re-rendering component HOT 1
- Images loaded over network twice with cache disabled HOT 4
- When Component Re-Renders with new src tag, image does not change. HOT 3
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.
from react-simple-img.