Quick Tip: Silverlight Integration within HTML content
Couple of days ago I've got question, how Silverlight content could been integrated/overlapped by some HTML/AJAX content. The samples I've received produced following behavior -
When clicking on hyperlink, it opens "modal pop-up" but Silverlight control is floating over it:
Another sample:
When clicking on "Click Here" button HTML "window" being placed behind Silverlight control:
Now the quick tip:
When you need to make layering, positioning, etc. integration of your Silverlight content and HTML content you have to define "Windowless" parameter for Silverlight object:
<asp:Silverlight ID="Xaml1" runat="server" Source="~/ClientBin/AjaxModal_SL.xap" Width="600px" Height="600px" Windowless="true" />
or
<object data="data:application/x-silverlight," type="application/x-silverlight-2-b2" width="100%" height="100%">
<param name="source" value="ClientBin/AjaxModal_SL.xap"/>
<param name="onerror" value="onSilverlightError" />
<param name="windowless" value="true" />
<a href="http://go.microsoft.com/fwlink/?LinkID=115261" style="text-decoration: none;">
<img src="http://go.microsoft.com/fwlink/?LinkId=108181" alt="Get Microsoft Silverlight" style="border-style: none"/>
</a>
</object>Now the samples works fine:
Enjoy,
Alex
P.S. Thanks to Denis for providing samples