Cara Membuat JQuery

Untuk membuat JQuery sangat mudah, karena bersifat Javascript.
JQuery adalah seperti ini :

Langkah-Langkahnya:

• Buka Blogger
• Dasbor
• Rancangan
• Pilih Gadget
• Pilih HTML/JAVASRIPT
• Lalu masukkan code berikut :

<style type="text/css">
h5 {
font-family: Comic Sans Ms;
font-size: 16px;
padding: 0 0 1em;
font-weight:bold;
color: #ffffff;
}
.msg_list {
list-style: none;
margin: 0;
padding: 0;
width: 100%;
}
.msg_head {
padding: 5px 13px;
cursor: pointer;
position: relative;
background-color:#cc0000;
margin:1px;
}
.msg_body {
padding: 10px 10px 10px;
background-color:#f4cccc;
}
</style>


<script type="text/javascript" src="https://sites.google.com/site/jquery01/tabmenuaccordion.js"></script>

<script type="text/javascript">
$(document).ready(function()
{
//hide the all of the element with class msg_body
$(".msg_body").hide();
//slides the element with class "msg_body" when paragraph with class "msg_head" is clicked
$("#firstpane h5.msg_head").click(function()
{
$(this).next("div.msg_body").slideToggle(700).siblings("div.msg_body").slideUp("slow");
});
//slides the element with class "msg_body" when mouse is over the paragraph
$("#secondpane h5.msg_head").mouseover(function()
{
$(this).next("div.msg_body").slideDown("slow").siblings("div.msg_body").slideUp("slow");
});
});
</script>

<div class="msg_list" id="secondpane">
<h5 class="msg_head"> Nama Widget 1 </h5>
<div class="msg_body">

Code JavaScript 1

</div>

<div class="msg_list" id="secondpane">
<h5 class="msg_head">Nama Widget 2</h5>
<div class="msg_body">

Code JavaScript 2

</div>

<div class="msg_list" id="secondpane">
<h5 class="msg_head">Nama Widget 3</h5>
<div class="msg_body">

Code JavaSript 3

</div>

<div class="msg_list" id="secondpane">
<h5 class="msg_head">Nama Widget 4</h5>
<div class="msg_body">

Code JavaSript 4

</div>

<div class="msg_list" id="secondpane">
<h5 class="msg_head">Nama Widget 5</h5>
<div class="msg_body">

Code JavaScript 5

</div></div></div></div></div></div>

• Save / Simpan

Tulisan Yang saya BOLD-kan Itu dapat diganti dengan Terserah anda.

untuk yang sudah pandai encoding, dapat mengganti-ganti tulisan yang saya Boldkan seperti warna,  size.

Bagi yang masih newbie, saya sarankan untuk hanya mengganti tulisan Nama Widget ... dan Code JavaScript ....

dan jika anda ingin menambah JQuery tersebut, anda dapat mengcopy paste:

<div class="msg_list" id="secondpane">

<h5 class="msg_head">Nama Widget ...</h5>

<div class="msg_body">

Code JavaSript ...

</div>

lalu diganti tulisan yang saya bold-kan. Jika anda ingin menghapus JQuery tersebut, hapuslah seperti biasa.

Jika ada yang tidak mengerti, silahkan bertanya melalui komentar.