A few months ago, I found an AngularsJs directive which creates a "fog of war".

When applied to a DOM element, say a <div>, everything surroundiing it is greyed, with a specified degree of opacity.

I have searched and can't find it again. Does anyone know what it is, or something similar?

[Update] I am pretty sure that I saw it on http://ngmodules.org/, so I am now searching the site & wil post here isf I find it.

[Update++] I think that I might have been misremembering http://ngmodules.org/modules/angular-blurred-modal (take alook at the demo) However, that ought to be modifiable to apply it to other HTML elements. As I said, I want to select a nested <div> and to blur everything outside of it.

  • 1
    Are you sure you didnt see the bootstap modal window instead? Together with ui-bootstrap you can use it in an angular project – dennismuijs May 4 '16 at 11:22
  • Do you have a URL? Is there a demo anywhere? – Mawg says reinstate Monica May 4 '16 at 11:37

to expand upon my comment:
It might be that you mean the bootstrap modal module as seen on this w3 school page
Bootstrap is a framework that provides an easier way to make responsive web sites, you can find it here: http://getbootstrap.com/
If you use angular I would advise bootstrap ui as wel since it doesn't require jquery and gives some added functionality made possible by angular.

  • Thanks. I am using AngularJs Bootstrap-UI, so will try to figure out how to get it working – Mawg says reinstate Monica May 4 '16 at 11:58
  • 1
    you're welcome, be sure to use the example on the angular-ui site as a guideline, things can get messy if you use the other examples and don't include jquery – dennismuijs May 4 '16 at 12:03
  • Do you happen to have a URL for an example? – Mawg says reinstate Monica May 4 '16 at 12:07
  • 1
    there is an example right here: angular-ui.github.io/bootstrap/#/modal it is a bit advanced maybe but you can edit the plunkr to see what does what, thats how I learned anyway. – dennismuijs May 4 '16 at 12:11
  • I see. Thanks. Not exactly what I want, though. I want to have the item on the page, not as a popup. I want to display a page and then programatically grey out its surrounds. I may be able to modify or borrow from that code, I suppose. – Mawg says reinstate Monica May 4 '16 at 18:59

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.