Andy E

I don't know if this has been brought up before, but in a few of my gadgets I have 2 style sheets, one for docked and one for undocked.

When switching stylesheets, everthing works perfectly except for the gadget size (in the css for the body element) - that has to be adjusted manually.

Andy


Re: Sidebar Gadget Development stylesheet switching bug

Jonathan Abbott

You just pointed out a glaring omission in my bug's list. I implemented a workaround in Media Player and then forgot to document it. So here goes:

How to set the body size through a stylesheet:

1. Create a dummy element in your Gadget html file

Code Snippet

<DIV id="divBodySize" class="bodySize" style="display:none"></DIV>



2. In the stylesheets, instead of setting width/height on body {}, set it on .bodySize {}:

Code Snippet

.bodySize{
width:163px;
height:149px;
}



3. When you change the stylesheet, set the body size with:

Code Snippet

document.body.style.width = parseInt(divBodySize.currentStyle["width"]);
document.body.style.height = parseInt(divBodySize.currentStyle["height"]);


EDIT: Added this as bug#35. I forgot to mention that you also can't set the background image (bug#15) or the background colour (bug#23).





Re: Sidebar Gadget Development stylesheet switching bug

ljames28

That's a good workaround, thanks. I've just been doing that programatically for the different skins i have for one of my gadgets, so their sizes had to be hard coded which was a nuisance.




Re: Sidebar Gadget Development stylesheet switching bug

Andy E

Jonathan, thanks for your workaround, I hadn't gotten around to implementing one yet Smile

However, assuming you had the "body" rule as the first stylesheet rule, a much easier workaround would be as follows:

Code Snippet
document.body.style.width = document.styleSheets[0].rules[0].style.width;
document.body.style.height = document.styleSheets[0].rules[0].style.height;

I tested it and it works fine, no need to create any dummy elements Smile

Andy