how to fire progressbar events jquery mobile
<p>if i use this scripts and css files</p>

<pre><code>    &lt;!DOCTYPE html&gt;
    &lt;html&gt;
    &lt;head&gt;
    &lt;meta charset="utf-8" /&gt;
    &lt;title&gt;progressbar&lt;/title&gt; 
    &lt;link href="../../Content/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"    /&gt; 
    &lt;script type="text/javascript" src="@Url.Content("~/Scripts/jquery-ui.min.js")"&gt;     &lt;/script&gt;
    &lt;script type="text/javascript"&gt;
        $(document).ready(function () {
            alert('hi');
            $("#progressbar").progressbar({ value: 70 });
        });
    &lt;/script&gt;
&lt;/head&gt;
&lt;body&gt;
   &lt;div id="progressbar"&gt; 
   &lt;/div&gt;
&lt;/body&gt;
&lt;/html&gt;
</code></pre>

<p>this is working fine.
but here i am using the other css files as because i am working for the mobiles.
 my project contains this is styles and scripts</p>

<pre><code>    &lt;html&gt;
     &lt;head&gt;
    &lt;meta charset="utf-8" /&gt;
    &lt;title&gt;@ViewBag.Title&lt;/title&gt;
    &lt;link href="@Url.Content("~/Content/jquery.mobile-1.0rc2.css")" rel="stylesheet" type="text/css" /&gt;  
    &lt;script src="@Url.Content("~/Scripts/jquery-1.6.4.min.js")" type="text/javascript"&gt;&lt;/script&gt; 
    &lt;script src="@Url.Content("~/Scripts/jquery.mobile-1.0rc2.js")" type="text/javascript"&gt;&lt;/script&gt; 
    &lt;meta name="viewport" content="width=device-width, initial-scale=1" /&gt;
    &lt;/script&gt;

    &lt;script type="text/javascript"&gt;
        $(document).ready(function () {
            alert('hi');
            $("#progressbar").progressbar({ value: 70 });
        });
&lt;/script&gt;
&lt;/head&gt;
&lt;body&gt;
    &lt;div id="progressbar"&gt; 
     &lt;/div&gt;
&lt;/body&gt;
&lt;/html&gt;
</code></pre>

<p>I am using <strong><em>jquery.mobile-1.0rc2.css</em></strong> for styles and <strong><em>jquery.mobile-1.0rc2.js</em></strong> for jquery.
so i have observed the styles in previous css file as</p>

<pre><code> .ui-widget {
 font-family: Verdana,Arial,sans-serif/*{ffDefault}*/;
 font-size: 1.1em/*{fsDefault}*/;
  }
 .ui-widget-content { border: 1px solid #aaaaaa/*{borderColorContent}*/; background:        #ffffff/*{bgColorContent}*/ url(images/ui-bg_flat_75_ffffff_40x100.png)/*{bgImgUrlContent}*/ 50%/*{bgContentXPos}*/ 50%/*{bgContentYPos}*/ repeat-x/*{bgContentRepeat}*/; color: #222222/*{fcContent}*/; }
 .ui-progressbar { height:2em; text-align: left; }
 .ui-progressbar .ui-progressbar-value {margin: -1px; height:100%; }
</code></pre>

<p>these styles are using for progress bar . so i copied them to <strong><em>jquery.mobile-1.0rc2.css</em></strong></p>

<p>but some calls are made in <strong><em>jquery-ui.min.js</em></strong> to apply the progressbar styles.</p>

<p>so how could accomplish this task without adding those files.</p>

<p>any help ?</p>

<p>Thanks in advance.</p>
