
Bring your mouse cursor to some links at my others blog here seo blog-tips , which i mean like that's
That's onmouseover function of java script , so if the mouse cursor cross over a link then will be visibleing an efect.
Ok, if you interest to use this "DODOL COLOR" with the easily way , then:
1- Insert the script below into your CSS/HTML section of your web, under the <body> tag,
Right after the tag itself, before anything else.
<script src="http://hastiantech.googlepages.com/dodol.js"></script>
After you placing the script , everyting links or anchor will be having the efects like my blog here.
2- If you'd like to add effect to other texts or paragraph (not link texts), then add the script below to the target tags:
onmouseover="dodol(this);"onmouseout="stopdodol();"
What's the tags? : "tag" is anything inside <> character , example :<p> or <span> or <div> or or others........
Below an example a text paragraph with dodol efect:
<p onmouseover="dodol(this);" onmouseout="stopdodol();" align="center">
example the paragraph with dodol efect
texample the paragraph with dodol efect
</p>
Exampleing for this usage , like at the first paragraph of this post,..please bring your mouse cursor up at that.
3- If you'd like to modifying for variations of the script, so...below the source code of "dodol script" , thats contained some description about color efects modification needed. please copy-pasting the code into notepad , then Save As with js extension , example color.js , dodol.js , mylink.js or ..others..
/************************************/
/* DODOL - COLOR SCRIPT */
/* (c) Iwan Rachmanto */
/* http://free-7.blogspot.com */
/********************************/
// begins to change variables
var rate = 27;
//====================================
// "rate" is if you change to lower this value
// will be soft progressively and if higher
// be sharply,standard of the rate
// among 0 - 255
//====================================
if (document.getElementById)
window.onerror=new Function("return true")
var objActive; // The object which event occured in
var act = 0; // Flag during the action
var elmH = 0; // Hue
var elmS = 112; // Saturation
//====================================
//var elmS is Saturation
// if you change to lower this value
// will be gloomy and if higher
// be more bright , standard of this value
// 0 to 255
//====================================
var elmV = 255; // Value
//================================================
//var elmV is the rate of RGB (red-green-blue)
// changing to lower this value will be blur
//and if higher be more contrast
//================================================
var clrOrg; // A color before the change
var TimerID; // Timer ID
//============================================
// Begins to change mouse command
//===========================================
if (document.all) {
document.onmouseover =dodollink;
document.onmouseout = stopdodollink;
}
else if (document.getElementById) {
document.captureEvents(Event.MOUSEOVER | Event.MOUSEOUT);
document.onmouseover = Mozilla_dodollink;
document.onmouseout = Mozilla_stopdodollink;
}
//===================================================
// This function begins to change a text color.
//===================================================
function dodol(obj)
{
if (act == 0) {
act = 1;
if (obj)
objActive = obj;
else
objActive = event.srcElement;
clrOrg = objActive.style.color;
TimerID = setInterval("ChangeColor()",150);
}
}
//===================================================
// This function stops to change a color.
//===================================================
function stopdodol()
{
if (act) {
objActive.style.color = clrOrg;
clearInterval(TimerID);
act = 0;
}
}
//===================================================
// doRainbowAnchor
// This function begins to change a link color
//====================================================
function dodollink()
{
if (act == 0) {
var obj = event.srcElement;
while (obj.tagName != 'A' && obj.tagName != 'BODY')
{
obj = obj.parentElement;
if (obj.tagName == 'A' || obj.tagName == 'BODY')
break;
}
if (obj.tagName == 'A' && obj.href != '') {
objActive = obj;
act = 1;
clrOrg = objActive.style.color;
TimerID = setInterval("ChangeColor()",150);
}
}
}
//=======================================================
// This function stops to change a link color
//=======================================================
function stopdodollink()
{
if (act) {
if (objActive.tagName == 'A') {
objActive.style.color = clrOrg;
clearInterval(TimerID);
act = 0;
}
}
}
//=========================================================
// This function begins to change a link color
//for Netscape6 and Mozilla browser)
//=========================================================
function Mozilla_dodollink(e)
{
if (act == 0) {
obj = e.target;
while (obj.nodeName != 'A' && obj.nodeName != 'BODY')
{
obj = obj.parentNode;
if (obj.nodeName == 'A' || obj.nodeName == 'BODY'
)
break;
}
if (obj.nodeName == 'A' && obj.href != '') {
objActive = obj;
act = 1;
clrOrg = obj.style.color;
TimerID = setInterval("ChangeColor()",150);
}
}
}
//=======================================================
// This function stops to change a link color
// (for Netscape6 and Mozilla browser)
//=======================================================
function Mozilla_stopdodollink(e)
{
if (act) {
if (objActive.nodeName == 'A') {
objActive.style.color = clrOrg;
clearInterval(TimerID);
act = 0;
}
}
}
//====================================================
// Change Color
// This function changes a color actually.
//====================================================
function ChangeColor()
{
objActive.style.color = makeColor();
}
//====================================================
// This function makes dodol colors.
// With litle mathematics calculations
// if you've didn't enough understanding the java script
// so please do experimenting ...
//====================================================
function makeColor()
{
// HSVtoRGB
if (elmS == 0) {
elmR = elmV; elmG = elmV; elmB = elmV;
}
else {
t1 = elmV;
t2 = (255 - elmS) * elmV / 255;
t3 = elmH % 60;
t3 = (t1 - t2) * t3 / 60;
if (elmH < 60) {
elmR = t1; elmB = t2; elmG = t2 + t3;
}
else if (elmH < 120) {
elmG = t1; elmB = t2; elmR = t1 - t3;
}
else if (elmH < 180) {
elmG = t1; elmR = t2; elmB = t2 + t3;
}
else if (elmH < 240) {
elmB = t1; elmR = t2; elmG = t1 - t3;
}
else if (elmH < 300) {
elmB = t1; elmG = t2; elmR = t2 + t3;
}
else if (elmH < 360) {
elmR = t1; elmG = t2; elmB = t1 - t3;
}
else {
elmR = 0; elmG = 0; elmB = 0;
}
}
elmR = Math.floor(elmR).toString(16);
elmG = Math.floor(elmG).toString(16);
elmB = Math.floor(elmB).toString(16);
if (elmR.length == 1) elmR = "0" + elmR;
if (elmG.length == 1) elmG = "0" + elmG;
if (elmB.length == 1) elmB = "0" + elmB;
elmH = elmH + rate;
if (elmH >= 360)
elmH = 0;
return '#' + elmR + elmG + elmB;
}
mas, kok ada dodolnya sih?he..he...
ReplyDelete@ Dian ..biar rasanya legit...hihi
ReplyDeleteThank You My Friend For This Useful Post
ReplyDeleteIf You Have Time Visit My Blog:
http://1001-tricks.blogspot.com