Kendo UI Window overlay opacity

Question

How can I set overlay opacity with CSS. I tried .k-overlay { opacity:0.9; } but it wont work. Can anyone help me? here I provide a simple demo

Answer 1

.k-widget would be a too broad selection. You can set the opacity for that very window once the window will be shown:

<script>
function onOpen() {
  setTimeout(function(){ $("#dialog").parent().css("opacity", 0.2); }, 10);
}

$("#dialog").kendoWindow({
  modal: true,
  open: onOpen
});
</script>

Answer 2

You could try .k-overlay { opacity:0.9 !important; } instead. That will override the setting which kendo applies directly to the overlay.