
- ចូលទៅ Layout >> ចុចលើតំណអក្សរ Add a Gadget នៅទីតាំងណាមួយ
(ឧទាហរណ៍សូមមើលរូបខាងក្រោម)
- រមូលចុះ (Scroll) រកមើល gadget ដែលមានឈ្មោះថា
HTML/JavaScript រួចលើវាដើម្បីបើក
(មើលរូបខាងក្រោមនេះ)
-ចម្លងកូនខាងក្រោមនេះ
យកទៅបិទភ្ជាប់ក្នុង HTML/JavaScript
Gadget ដោយមិនបាច់ដាក់ឈ្មោះ
រួចចុចប៊ូតុង Save ។ (លោកអ្នកគួរទុកដាក់ Gadget នោះនៅទីតាំងសមរម្យ ឧទាហរណ៍
ដោយចាប់ទាញយកទៅដាក់ខាងស្តាំ និងក្រោមគេបំផុត)
កូដរូបពងទឹកពេលមានចលនារបស់
cursor
<script
type="text/javascript">
var
colours=new Array("#F781BE", "#F781BE",
"#F781BE", "#F781BE", "#F781BE"); // warna untuk
border-top, border-right, border-bottom, border-left dan background gelembung
var
bubbles=100; // jumlah maksmal gelembung
var
x=ox=400;
var
y=oy=300;
var
swide=800;
var
shigh=600;
var
sleft=sdown=0;
var bubb=new
Array();
var
bubbx=new Array();
var
bubby=new Array();
var
bubbs=new Array();
window.onload=function()
{ if (document.getElementById) {
var rats,
div;
for (var
i=0; i<bubbles; i++) {
rats=createDiv("3px",
"3px");
rats.style.visibility="hidden";
div=createDiv("auto",
"auto");
rats.appendChild(div);
div=div.style;
div.top="1px";
div.left="0px";
div.bottom="1px";
div.right="0px";
div.borderLeft="1px
solid "+colours[3];
div.borderRight="1px
solid "+colours[1];
div=createDiv("auto",
"auto");
rats.appendChild(div);
div=div.style;
div.top="0px";
div.left="1px";
div.right="1px";
div.bottom="0px"
div.borderTop="1px
solid "+colours[0];
div.borderBottom="1px
solid "+colours[2];
div=createDiv("auto",
"auto");
rats.appendChild(div);
div=div.style;
div.left="1px";
div.right="1px";
div.bottom="1px";
div.top="1px";
div.backgroundColor=colours[4];
div.opacity=0.5;
if
(document.all) div.filter="alpha(opacity=50)";
document.body.appendChild(rats);
bubb[i]=rats.style;
}
set_scroll();
set_width();
bubble();
}}
function
bubble() {
var c;
if (x!=ox ||
y!=oy){
ox=x;
oy=y;
for (c=0;
c<bubbles; c++) if (!bubby[c]) {
bubb[c].left=(bubbx[c]=x)+"px";
bubb[c].top=(bubby[c]=y)+"px";
bubb[c].width="3px";
bubb[c].height="3px"
bubb[c].visibility="visible";
bubbs[c]=3;
break;
}
}
for (c=0;
c<bubbles; c++) if (bubby[c]) update_bubb(c);
setTimeout("bubble()",
40);
}
function update_bubb(i)
{
if
(bubby[i]) {
bubby[i]-=bubbs[i]/2+i%2;
bubbx[i]+=(i%5-2)/5;
if
(bubby[i]>sdown && bubbx[i]>0) {
if
(Math.random()<bubbs[i]/shigh*2 && bubbs[i]++<8) {
bubb[i].width=bubbs[i]+"px";
bubb[i].height=bubbs[i]+"px";
}
bubb[i].top=bubby[i]+"px";
bubb[i].left=bubbx[i]+"px";
}
else {
bubb[i].visibility="hidden";
bubby[i]=0;
return;
}
}
}
document.onmousemove=mouse;
function
mouse(e) {
set_scroll();
y=(e)?e.pageY:event.y+sleft;
x=(e)?e.pageX:event.x+sdown;
}
window.onresize=set_width;
function set_width()
{
if
(document.documentElement && document.documentElement.clientWidth) {
swide=document.documentElement.clientWidth;
shigh=document.documentElement.clientHeight;
}
else if
(typeof(self.innerHeight)=="number") {
swide=self.innerWidth;
shigh=self.innerHeight;
}
else if
(document.body.clientWidth) {
swide=document.body.clientWidth;
shigh=document.body.clientHeight;
}
else {
swide=800;
shigh=600;
}
}
window.onscroll=set_scroll;
function
set_scroll() {
if
(typeof(self.pageYOffset)=="number") {
sdown=self.pageYOffset;
sleft=self.pageXOffset;
}
else if
(document.body.scrollTop || document.body.scrollLeft) {
sdown=document.body.scrollTop;
sleft=document.body.scrollLeft;
}
else if
(document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft))
{
sleft=document.documentElement.scrollLeft;
sdown=document.documentElement.scrollTop;
}
else {
sdown=0;
sleft=0;
}
}
function
createDiv(height, width) {
var
div=document.createElement("div");
div.style.position="absolute";
div.style.height=height;
div.style.width=width;
div.style.overflow="hidden";
return
(div);
}
</script>
- លោកអ្នកអាចដូរពណ៌របស់
"ពងទឹក" បានត្រង់កន្លែង៖
var
colours=new Array("#F781BE", "#F781BE",
"#F781BE", "#F781BE", "#F781BE") = ដូរ F781BE ទៅជាតម្លៃពណ៌ដែលអ្នកចង់បាន។
ចំណាំ ៖ បើចង់ដក "Effect ពងទឹក" ចេញវិញ គ្រាន់តែលោកអ្នករក HTML/JavaScript Gadget ដែលមានផ្ទុកកូដពងទឹក ចេញពីផ្នែក
Layout ជាការស្រេច។
បន្ទាប់ពីដាក់
ឲ្យមានពងទឹកអណ្តែតឡើងលើនៅពេលមានចលនារបស់ cursor រួចមកឃើញថា
វាជួយលំអប្លករបស់លោកអ្នកបានមួយកំរិតទៀតដែរ។ ជួបគ្នាលើកក្រោយទៀត
ជាមួយគន្លឹះប្លកល្អៗជាភាសាខ្មែរ។