Blogger បានអនុញ្ញាតិឲ្យអ្នកប្រើប្រាស់អាចដាក់កូដផ្សេងៗបានជាច្រើន
និងមានមុខងារល្អជាង Wordpress
ជាច្រើន
បើទោះជាសេវាកម្មប្រើមិនគិតប្រាក់ដូចគ្នាក៏ដោយ។
កាលពីលើកមុនប្លក Idea For khmer ធ្លាប់បានលើកយក Effect មួយប្រភេទ
ដែលអាចធ្វើឲ្យមានជា "រូបផ្កាយតូចៗជ្រុះចេញនៅពេលលោកអ្នករំកិលកណ្ដុរ"។ ក្នុងគន្លឹះនេះ
ខ្ញុំនិងបង្ហាញជួនពីរបៀបដាក់ជា
"ពងទឹកឬក៏ពពុះទឹកអណ្ដែតឡើងលើ" នៅពេលមានរចនា cursor វិញម្ដង ហើយ Widget Effect មួយនេះ វាជាប្រភេទកូដ JavaScript ដែលងាយស្រួលដាក់
និង ដកចេញវិញណាស់។ ដើម្បីដឹងថាវាមានលក្ខណៈបែបណានោះសូមមើលខាងក្រោមនេះ
ទាំងអស់គ្នា ជាពិសេសអ្នកមានប្លក៖
- កត់ត្រាចូល (Log In) ទៅក្នុងគណនី Blogger របស់អ្នក។
- ចូលទៅ 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 រួចមកឃើញថា
វាជួយលំអប្លករបស់លោកអ្នកបានមួយកំរិតទៀតដែរ។ ជួបគ្នាលើកក្រោយទៀត
ជាមួយគន្លឹះប្លកល្អៗជាភាសាខ្មែរ។