Media Query for Blocs Demo

This page shows examples of Media Query dynamic applying custom classes at various custom breakpoints.

Color Demo

Create a class in Blocs with any properties you want added dynamically. This includes positioning, animation, scaling etc. Resize your browser to see the colors change at the custom breakpoints.

0px – 500px  Lavender

501px – 600px  Red

601px – 800px  Blue

801px – 1000px  Green

1001px – 6000px Tangerine

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim.

Position Demo

Create a class in Blocs with any properties you want added dynamically. This includes positioning, animation, scaling etc. Resize your browser to see the positions at the custom breakpoints.

0px – 500px  move-left

501px – 600px  move-right

601px – 800px  move-up

801px – 1000px  move-down