1

I've been implementing an answer that was asked about resizing a div width here:

Angular JS resizable div directive

This answer sets up a nice little directive that resizes divs, using

 $($attrs.resizerLeft).css({ width: x + 'px' }); $($attrs.resizerRight).css({ left: (x + parseInt($attrs.resizerWidth)) + 'px', width: (parseInt(window.innerWidth - x)) + 'px' }); 

However, I want to have a resizable div and also use media queries to rearrange the content as the div is resized. So I've taken the centre div and added in some simple Boostrap columns, but the media queries do not fire when the resizer changes the div widths.

Here's a plunk with an example of the problem:

http://plnkr.co/edit/1A7URWAQPl23FZy45Gxp?p=preview

Is there any way to have the resizer trigger the media queries that Bootstrap uses to rearrange the layout?

1
  • 4
    Media queries don't "fire", and they can't be "triggered" manually. They're not scripts. Also, you can't tie them to element widths. Instead, add a class to the body or some other ancestor element and select from that. Commented May 17, 2016 at 15:58

0

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.