search

neokoenig / jQuery-gridmanager

A way of building rows and grids with built in editable regions; requires jQuery, jQueryUI, Bootstrap 3.x, & optional TinyMCE or CKEditor
http://neokoenig.github.io/jQuery-gridmanager/
461 stars 129 forks source link

Mobile Layout Issue #71

Closed ashishbhattb closed 9 years ago

ashishbhattb commented 9 years ago

Hi, My Simple Question, How to fix the mobile layout as grid manager automatically adding col-md-3 but also adding same for the mobile also.

Check the below Example < div class="row" >< div class="column col-md-3 col-sm-3 col-xs-3" >< /div >< div class="column col-md-3 col-sm-3 col-xs-3" >< /div >< div class="column col-md-3 col-sm-3 col-xs-3" >< /div >< div class="column col-md-3 col-sm-3 col-xs-3" >< /div >< /div >

Here for desktop working fine but stuck in mobile i want to set for mobile as col-sm-12 col-xs-12 which is not getting executed and due to this my mobile layout is not managing as per the bootstrap standard format

Please guide me for the same.

Regards, Ashish Bhatt

neokoenig commented 9 years ago

So to edit the other non-desktop classes, select mobile from the dropdown on the top right - that'll let you edit col-sm-x etc ... or have I misunderstood you?

ashishbhattb commented 9 years ago

Hi ,

Thanks for the prompt response. I managed to edit mobile device attributes from the top right editor option

Thanks.

Ashish Bhatt

ashishbhattb commented 9 years ago

Hi,

I have made the changes but still i think some issue is there.

May by my markup is not proper or may be some structure issue

Steps to detect issue 1) open link http://webdemo.cwsdemo.com:7777/samples/landing-page.html 2) select Mobile layout from the right side dropdown

Now here i cant get the access for resize and all the events are not working

Please guide me for the same, where i have done the mistake

neokoenig commented 9 years ago

Gm doesn't support containers within the canvas. It only supports rows. What's happening is that the markup isn't being applied to the middle container. Try just using Gridmanager on the middle section, and make sure it's mycanvas > .row

ashishbhattb commented 9 years ago

Hmm yes, i have done some markup issues and resolved that now check demo, i have made 2 demo let me explain you the exact case where we stuck Demo 1 is working fine for desktop, tablet and mobile Demo 2 is working for desktop only and not for mobile and tablet

The only difference is of attribute "itemType" nothing else

Demo 1 http://webdemo.cwsdemo.com:7777/samples/landing-page.html Demo 2 http://webdemo.cwsdemo.com:7777/samples/landing-page-with-attributes.html

Demo 2 not working for tablet and mobile due to itemtype="xyz" added, and i needs for my developer reference otherwise cant make the application dynamic

Please guide me for the same.

neokoenig commented 9 years ago

I'm pretty sure you can't use itemType in that way. ItemType needs itemScope - https://schema.org/docs/gs.html and needs to be a URL for microdata. If you need to store additional information, you could use data-itemType="foo" I guess.

ashishbhattb commented 9 years ago

Thanks Its Done by managing the attribute at child level