Semi transparent window

[Rene]

I am trying to override the current theme and create a Kendo window having a semi transparent PNG as a background (window will be see through somewhat).

In the window creation I have the following - but it's not working - it's still defaulting to the current theme's window background color:

.HtmlAttributes( new { style="background-color:transparent;background-image:'/images/bg_trans_60.png';background-repeat:repeat;"} )

Please advise.

Thanks.

[Iliana Dyankova]

Hello Rene,

In order to achieve the desired outcome you should set transparent background and to the element with class "k-window". I.e.":

@(Html.Kendo().Window()
  //....
  .HtmlAttributes( new { style="background-color:transparent;background-image:'/images/bg_trans_60.png';background-repeat:repeat;"} )
)

<style>
.k-window{
    background: transparent;
}
</style>

Let me know if this fits your requirements. 

Regards,
Iliana Nikolova
the Telerik team

[Rene]

Thanks Iliana.

I managed to pull it off this way:

@(Html.Kendo().Window()
   .Name("myWindow")
   .Title("Test Window")
   .Content("Loading Info...")
   .Visible(false)
   .Modal(true)
   .Animation(true)
   .Width(528)
   .Height(400)
   .Iframe(true)
   .Draggable()
   .Resizable()
)

<button onclick='Javascript:openMyWindow();return false;'>Click Me</button>

<style scoped>

.transparentStyle
{
background: transparent;
background-color:transparent;
}

.smokyGlass
{
background: url('/images/bg_trans_60.png');
background-color:transparent;
background-repeat:repeat;
}

</style>


<script type="text/javascript">


function openMyWindow() {

   var window = $("#myWindow").data("kendoWindow");
   window.open();
 
   window.wrapper.addClass('smokyGlass');

   $winContentSpan = window.wrapper.find('.k-window-content');
   $winContentSpan.addClass('transparentStyle');

 }

</script>

[Iliana Dyankova]

Hello Rene,

I am glad to hear the desired result is already achieved. 

Regards,
Iliana Nikolova
the Telerik team

[Rene]

I just edited the solution.

Basically what I'm working on is a popup picklist window using the Kendo grid (appearing on that semi transparent window) where having over 20K items in a dropdownlist / combobox is obviously not the way to go.