This is done through a skin object/widget. Check out the default MinimalExtropy/Index skin to see how to use this in your own skins.

I am currently getting things setup so I can try to provide you some sample code here in a few minutes.

Hi,

My name is Prabakaran.K .

My Html content are below:

 <object id="SizeWidget" codetype="dotnetnuke/client" codebase="StyleSheetWidget"
                declare="declare">
                <param name="baseUrl" value="/snapev2A/Portals/_default/Skins/MinimalExtropy/css/variations/" />
                <param name="template" value="&lt;div title='{TEXT}' {ID} {CLASS}&gt;&lt;/div&gt;" />
                <param name="default" value="width1024" />
                <param name="Width 1024" value="width1024" />
                <param name="Width 1280" value="width1280" />
                <param name="Full Width" value="widthfull" />
</object>

When i validate the above Html content for Web Content Accessbility guidelines( WCAG ) it told that object tag having element content. So i put the content like this

<object id="SizeWidget" codetype="dotnetnuke/client" codebase="StyleSheetWidget"
                declare="declare">
                <param name="baseUrl" value="/snapev2A/Portals/_default/Skins/MinimalExtropy/css/variations/" />
                <param name="template" value="&lt;div title='{TEXT}' {ID} {CLASS}&gt;&lt;/div&gt;" />
                <param name="default" value="width1024" />
                <param name="Width 1024" value="width1024" />
                <param name="Width 1280" value="width1280" />
                <param name="Full Width" value="widthfull" />

                Loading...
</object>

Now check again the WCAG is passed. But the sizewidget image does not shown in IE alone. Can you give me the solution for this...