javascript - Zurb Foundation based CMS, preview effect of media queries -


i'm building cms based on zurb foundation, , 1 thing i'd allow user switch between large/medium/small layouts via button can both preview how page looks @ size, can set columns etc. different breakpoints.

media queries predicated on window width, , i've been far able build users find quite intuitive, , feel asking them resize browser window change mode seems bit iffy.

an immediate way can think of use iframe main edit view, problem page interactions have quite complex, drag & drop, drag resize etc. - have of these working @ present both mouse , touch, , in order drag & drop between parent , iframe i'd have rewrite significant amount of code. i'd rather avoid if @ possible.

i'm looking suggestions/advice on how make work - workarounds , hacks fine.

this how looks @ moment, give idea of kind of interface have - no live link can share atm, sorry:

foundation cms

ok - solution i've come far - whole page, not editor area goes in iframe.

https://gist.github.com/nrkn/00e1fb7cc4c7b43329a3

https://cdn.rawgit.com/nrkn/00e1fb7cc4c7b43329a3/raw/69a85b12dda7cece2b7ed602503c45d16f898d15/iframe-rawgit.html


Popular posts from this blog

c# - ODP.NET Oracle.ManagedDataAccess causes ORA-12537 network session end of file -

matlab - Compression and Decompression of ECG Signal using HUFFMAN ALGORITHM -

utf 8 - split utf-8 string into bytes in python -