Zappos-like split view possible?


Is it possible to create a split view that (in landscape) would allow me to tap on a link from the main view (in this case the right) and load the page using the entire view rather than just main as in the Zappos’ iPad app? I’m assuming I need 3 views loading left and right views inside a main view. I’m attaching two images of Zappos iPad app on landscape mode that shows what I mean. Thanks!


Thinking about it now. It may be easier on init for the product page above to remove the left view completely and reload it on beforeout?


This is an ugly hack but it seems to do the trick for now. Hoping someone has a better suggestion.

$$(document).on('page:init', '.page[data-name="productinfo"]', function (e) {
    $$('.panel-left').css('left', '-25%x');
    $$('.view-main').css('width', '100%').css('left', '-25%');

$$(document).on('page:beforeout', '.page[data-name="productinfo"]', function (e) {
    $$('.panel-left').css('left', '0');
    $$('.view-main').css('width', '75%').css('left', '0');