Created
February 14, 2016 21:57
-
-
Save argyleink/2127a7303126da960f70 to your computer and use it in GitHub Desktop.
Fix mobile layout thrashing from using VH's
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var els = document.querySelectorAll('.vh-fix') | |
if (!els.length) return | |
for (var i = 0; i < els.length; i++) { | |
var el = els[i] | |
if (el.nodeName === 'IMG') { | |
el.onload = function() { | |
this.style.height = this.clientHeight + 'px' | |
} | |
} else { | |
el.style.height = el.clientHeight + 'px' | |
} | |
} |
nice, that's a great newer solution!
custom properties are amazing, what can't they do! right!?
thanks for the share 👍
…On Fri, Jan 10, 2020 at 7:25 PM Benjamin Liii ***@***.***> wrote:
Hey, Adam, I found your command in Jen's tweet about 100vh issue.
Your solution is quite creative and impressive👍, but I wonder if this is
a trade off with performance.🤔
Anyway, our team actually encountered 100vh issue not long ago, and we use
the trick from this post to solve the problem.
Also a pretty neat trick!😆 the-trick-to-viewport-units-on-mobile
<https://css-tricks.com/the-trick-to-viewport-units-on-mobile/>
—
You are receiving this because you authored the thread.
Reply to this email directly, view it on GitHub
<https://gist.github.com/2127a7303126da960f70?email_source=notifications&email_token=AAIVAHHCSUTY4OCUROM3ZX3Q5E32LA5CNFSM4KFPZOA2YY3PNVWWK3TUL52HS4DFVNDWS43UINXW23LFNZ2KUY3PNVWWK3TUL5UWJTQAF7JQ2#gistcomment-3134221>,
or unsubscribe
<https://github.com/notifications/unsubscribe-auth/AAIVAHGLXUMJZPNXNNPPU2TQ5E32LANCNFSM4KFPZOAQ>
.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Hey, Adam, I found your command in Jen's tweet about 100vh issue.
Your solution is quite creative and impressive👍, but I wonder if this is a trade off with performance.🤔
Anyway, our team actually encountered 100vh issue not long ago, and we use the trick from this post to solve the problem.
Also a pretty neat trick!😆 the-trick-to-viewport-units-on-mobile