Onsen UI 2.0 Preview: Responsive Hybrid Apps with the New Splitter Element
-
The road that will bring us to Onsen UI 2.0 becomes more exciting every day. That’s why we are happy to introduce a new Onsen UI element: The
<ons-splitter>
!</ons-splitter>Click here to see the original article
-
So we attempted to use this as an media query (collapse="(max-device-width: 1600px)" ) seemed to work. Not sure if we are using the media query correctly in the collapse attribute but it seems to work?
-
@Dennis-Ferreira As stated in the docs, yes, this is correct :)
-
I’ve tried to follow this tutorial but I couldn’t be able to open the menu programatically. The menu opens good when I swipe my finger to the right, but when I call the code document.querySelector(‘ons-splitter’).toggleLeft() I get this error: “Uncaught TypeError: document.querySelector(…).toggleLeft is not a function”. So I can’t open the menu when the user clicks in a menu button, because that error occurs on the click event of my button. Do you have any suggestions on how I can fix this?
-
@Ulysses-Alves I believe this was replaced with just toggle. Try that.
-
@Ulysses-Alves @munsterlander This was released during v2 beta and it changed a little bit for the final release. The main
ons-splitter
only has properties to accessons-splitter-side
andons-splitter-content
. Have a look at the reference for those elements.