Image Map

Efeito Arco-íris nos links do seu Blog

Oi fufurinhas!
Tudo bem?
Trouxe um efeito mega fofo para vocês. Ele se chama efeito arco-íris.
Pra dar certo, você tem que seguir o tutorial passo-a-passo pra ficar tudo perfeito no final. E lembre-se que este código se aplica à todos os links que seu blog possui.

Quer o efeito no seu blog? É só clicar no Leia Mais para ver a continuação da postagem e o tutorial.
Temos dois códigos. Um para Internet Explorer, e outro para Google Chrome e outros.

1º código (Internet Explorer): Abra o HTML do seu blog, e marque a opção expandir modelos de widgets. Pressione Ctrl+F e procure por ]]></b:skin> na barra de pesquisa:

ABAIXO de ]]></b:skin> cole o seguinte código:
<!-- INÍCIO DO SCRIPT LINKS COLORIDOS--><br /><br /><script type='text/javascript'>// <![CDATA[var rate = 20; // Increase amount(The degree of the transmutation)



////////////////////////////////////////////////////////////////////// Main routine

if (document.getElementById)window.onerror=new Function("return true")

var objActive; // The object which event occured invar act = 0; // Flag during the actionvar elmH = 0; // Huevar elmS = 128; // Saturationvar elmV = 255; // Valuevar clrOrg; // A color before the changevar TimerID; // Timer ID



if (document.all) {document.onmouseover = doRainbowAnchor;document.onmouseout = stopRainbowAnchor;}else if (document.getElementById) {document.captureEvents(Event.MOUSEOVER | Event.MOUSEOUT);document.onmouseover = Mozilla_doRainbowAnchor;document.onmouseout = Mozilla_stopRainbowAnchor;}



//=============================================================================// doRainbow// This function begins to change a color.//=============================================================================function doRainbow(obj){if (act == 0) {act = 1;if (obj)objActive = obj;elseobjActive = event.srcElement;clrOrg = objActive.style.color;TimerID = setInterval("ChangeColor()",100);}}



//=============================================================================// stopRainbow// This function stops to change a color.//=============================================================================function stopRainbow(){if (act) {objActive.style.color = clrOrg;clearInterval(TimerID);act = 0;}}



//=============================================================================// doRainbowAnchor// This function begins to change a color. (of a anchor, automatically)//=============================================================================function doRainbowAnchor(){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()",100);}}}



//=============================================================================// stopRainbowAnchor// This function stops to change a color. (of a anchor, automatically)//=============================================================================function stopRainbowAnchor(){if (act) {if (objActive.tagName == 'A') {objActive.style.color = clrOrg;clearInterval(TimerID);act = 0;}}}



//=============================================================================// Mozilla_doRainbowAnchor(for Netscape6 and Mozilla browser)// This function begins to change a color. (of a anchor, automatically)//=============================================================================function Mozilla_doRainbowAnchor(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()",100);}}}



//=============================================================================// Mozilla_stopRainbowAnchor(for Netscape6 and Mozilla browser)// This function stops to change a color. (of a anchor, automatically)//=============================================================================function Mozilla_stopRainbowAnchor(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();}



//=============================================================================// makeColor// This function makes rainbow colors.//=============================================================================function makeColor(){// Don't you think Color Gamut to look like Rainbow?

// HSVtoRGBif (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;}// ]]>

</script>


Depois de colocar o código, visualize, e se tiver tudo bonitinho, salve!
----------------------------------------------------------------------------------------------------------


2º código: Abra o HTML do seu blog, e marque a opção expandir modelos de widgets. Pressione Ctrl+F e procure por </head> na barra de pesquisa:



ANTES de </headcole o seguinte código:



<script src='http://dl.getdropbox.com/u/647003/CiudadBlogger/Scripts/rainbowlinks.js'/>


Depois de colocar o código, visualize, e se tiver tudo bonitinho, salve!
----------------------------------------------------------------------------------------------------------
Gostou? Então comente aqui no post!

Bjos gigantes da Carol!

(Créditos à Jackie Dream pelo código)

5 comentários:

  1. Estava navegando pela net e tive a alegria de encontrar seu blog... Amei seu cantinho!!!

    Convido você a dar uma passadinha, se puder, no meu blog: http://www.docesonhodemenina.com.br/
    Conto com sua presença, vou amar te ver lá no DSM!!!

    Ah, como eu amei seu blog, deixo também um selinho para você: http://1.bp.blogspot.com/-68Bb05pFul4/Te1BfsqvBeI/AAAAAAAAATM/JPCRr0Mj7R0/s1600/dsm-selinho.jpg
    Pode crer, só os melhores ganham esse selinho!!!

    Desde já agradeço por tudo, que Deus lhe abençoe!!!

    Mil Sweetkisses ♥.♥
    http://www.docesonhodemenina.com.br/

    ResponderExcluir
  2. Otimo tutorial mais acho que nao fica mt bom com o meu blog! ¬¬
    ammr,poderia me visitar e me seguir?
    www.paradateen1.blogspot.com
    um super beijo =*

    ResponderExcluir
  3. Linda,ja te coloquei la no meu blog como afiliada
    quando fizer o mesmo me avisa!

    bjk

    www.yesteens2.blogspot.com

    ResponderExcluir

Vai comentar? Que bom! Só não esqueça das regrinhas:

* Não xingue.
* Não ofenda ninguém.
* Deixe o link do seu blog e/ou site (se tiver).
* Tenha educação!