Silverlight z-index not working!

June 1, 2009

Hahhahaha, I know the answer to this :)). Ok, enough being a jerk. Basically Silverlight would not entertain z-index parameter which is assigned to the object tag until it has a parameter Windowless set to true. Here is a typical object tag which works with z-index as –1 on it.

<object data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="100%" height="100%" style="z-index:-1;">
    <param name="source" value="ClientBin/SilverlightApplication4.xap"/>
    <param name="onerror" value="onSilverlightError" />
    <param name="background" value="white" />
    <param name="minRuntimeVersion" value="2.0.31005.0" />
    <param name="autoUpgrade" value="true" />
    <param name="Windowless" value="true" />
    <a href="http://go.microsoft.com/fwlink/?LinkID=124807" style="text-decoration: none;">
         <img src="http://go.microsoft.com/fwlink/?LinkId=108181" alt="Get Microsoft Silverlight" style="border-style: none"/>
    </a>
</object>

Although there is one caveat here, while creating a Silverlight object using the createObject method, be sure to use the parameter name isWindowless and not Windowless.

Peace!

Abhang Rane


4 comments :

Reader's Comments

  1. AnonymousDecember 10, 2009 at 11:57 PM

    "be sure to use the parameter name isWindowless and not Windowless"
    Exactly opposite: you need to use Windowless=true

    ReplyDelete
  2. AnonymousApril 8, 2010 at 3:28 AM

    Hi, really helpful...
    could you explain exactly what does windowless means..

    ReplyDelete
  3. Abhang RaneApril 8, 2010 at 6:36 AM

    Hi there,
    So Windowless property can be used to tell whether your silverlight control will blend with the other HTML controls on the page. What I mean is, if your silveright control is displayed within the Silveright window, that is Windowless=false, then it will hide other HTML controls behind it regardless of the CSS values. If you set Windowless as true, then your CSS would work and you can overlay your HTML controls over the Silverlight control if needed.
    Hope this helps!

    ReplyDelete
  4. UnknownJuly 29, 2010 at 9:14 AM

    Thanks !!!

    Try this :
    Windowless="true"

    Css :
    position:relative;
    z-index:-1;

    It works for me !

    ReplyDelete