Is there an easy way to hide components based on the user’s screen width? For example, I have a search field in my navigation bar that I would like to hide if the user is accessing the page from a mobile device. Thanks!
Question
Hide components on screen width?
+7This topic has been closed for replies.
+20Yup. Made a post on this. A small snippet and you’re set.
http://community.skuid.com/t/simple-solution-for-conditional-rendering-on-width
+5- Nintex Employee
I used css to set breakpoints for mobile device if you’d like a css-only solution
@media only screen and (max-width: 768px) { /* Add css here that applies only to tablet and mobile sizes : */
#desktop-nav { display:none; } #desktop-nav #app-name { font-size: 15px; /* make title a bit smaller on smaller screens */
} } @media only screen and (min-width: 800px) { /* For desktop or any screen larger than 800px wide: */ #mobile-nav { display:none; } }<br />
This is really slick! I didn’t know about this kind of CSS capability. Not to mention nested CSS.
+9Just came across this and wanted to provide a quick update, since this can now be handled declaratively in Spark v2 using the new Viewport Width rendering condition.
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.