Hi the ionic backdrop grays out the modal too when I do this: $scope.openBrandModal = function() { $ionicBackdrop.retain(); $scope.brandModal.show(); }; How can I grey out only the view behind the modal and not the modal ? Thanks

Can someone help me with this please ?

Hi, I have never used the ionic backdrop, put I am pretty sure if you put a z-index (in css) higher for the modal, it will work. But I believed, the ionic modal already has a backdrop, hasnt it ?

Hi @gensollen , the ionic modal doesn’t seem to have a backdrop no. Too bad, this could be a good feature. I am going to try with z-index.

Are you sure about that ? Look here : http://codepen.io/ionic/pen/gblny And you can set if you want the backdrop to be able to close the modal.

indeed I see the backdrop in this codepen. But in my case there’s no backdrop around the modal. How do you set if you want the backdrop to close the modal or not?

Actually I see the backdrop div when I inspect my code, but it is not apparent, but it’s not rendered…argh I can’t understand why !!

If you’re having this problem on mobile, it’s because the style uses a media query for screens over 680px. I worked around it by adding the same styles in my own stylesheets, so it applies the styles always, regardless of screen size: .modal-backdrop-bg { transition: opacity 300ms ease-in-out; …

Yes you’re right that’s it ! Perfect! Thanks for your help :slight_smile:

excuse me! where do you put the class?? And where you call it? i can´t show the backdrop

How to show backdrop behind modal

pankajanc June 30, 2017, 2:57pm 10

It works. But when the modal opens it also (modal) is gray colored. Is there anyway to prevent that ?

Topic		Replies	Views
$ionicBackdrop : how to grey out the background only with a modal	1	1192	October 25, 2015
Backdrop behind modals ionic-v1	5	2996	December 4, 2017
Ionic 4 modal backdrop is over modal content Ionic Framework	6	2620	July 19, 2021
Modal backdrop does not work ionic-v3	0	943	September 3, 2017
Cannot dismiss a modal by clicking the backdrop (ionic 6) Ionic Framework	6	6323	September 10, 2024

How to show backdrop behind modal

Related topics