How to Implement jquery UI on Google Blogger

Jquery UI  is a powerful java library and can be used in Blogger by adding th following code just after the tag <head> in the templates option  ( Design -> Html Edition  )

<link href='http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css' rel='stylesheet' type='text/css'/>
  <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js' type='text/javascript'/>
  <script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js' type='text/javascript'/>

For example , if you want to use the accordion UI widget you can additionally put this code :


<script type='text/javascript'>
    $(function() {
        $(&quot;#accordion&quot;).accordion({
            collapsible: true,active:false
        });
    });
</script>

Then on an entry you can use this code


<div id="accordion">
<h3>
<a href="#">First header</a></h3>
<div>
First content</div>
<h3>
<a href="#">Second header</a></h3>
<div>
Second content</div>
</div>

to obtain obtain this functionality:


First header

First content

Second header

Second content

Comments

Popular posts from this blog

Crystal Reports Error 1606 could not access network location v4.030319\ASP.NETClientFiles\

Timeout expired. The timeout period elapsed prior to obtaining a connection from the pool. This may have occurred because all pooled connections were in use and max pool size was reached."

Asp.net Security : A case using WebInspect