2015-10-18 17 views
0

我發現這個javascript代碼可以讓鏈接變得多彩。我想在頁面上使用它,但我不希望它在每個div上都能正常工作。 是否可以禁用和/或啓用下面的代碼只爲一些特定的div?讓Javascript只能在幾個特定的​​div中工作

謝謝!

<script type='text/javascript'> 
//<![CDATA[ 
var rate = 50; 
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 = 128; // Saturation 
var elmV = 255; // Value 
var clrOrg; // A color before the change 
var 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; 
} 
function doRainbow(obj) { 
    if (act == 0) { 
     act = 1; 
     if (obj) 
      objActive = obj; 
     else 
      objActive = event.srcElement; 
     clrOrg = objActive.style.color; 
     TimerID = setInterval("ChangeColor()", 100); 
    } 
} 
function stopRainbow() { 
    if (act) { 
     objActive.style.color = clrOrg; 
     clearInterval(TimerID); 
     act = 0; 
    } 
} 
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); 
     } 
    } 
} 
function stopRainbowAnchor() { 
    if (act) { 
     if (objActive.tagName == 'A') { 
      objActive.style.color = clrOrg; 
      clearInterval(TimerID); 
      act = 0; 
     } 
    } 
} 
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); 
     } 
    } 
} 
function Mozilla_stopRainbowAnchor(e) { 
    if (act) { 
     if (objActive.nodeName == 'A') { 
      objActive.style.color = clrOrg; 
      clearInterval(TimerID); 
      act = 0; 
     } 
    } 
} 
function ChangeColor() { 
    objActive.style.color = makeColor(); 
} 
function makeColor() { 
    // Don't you think Color Gamut to look like Rainbow? 
    // 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; 
} 
//]]> 
</script> 

回答

0

使用CSS懸停選擇並添加類到div,像這樣...

<style> 
    .colourful_link a:hover{ 
     color:green; 
    } 
</style> 

<div class="colourful_link"> 
<a href="#">I go Nowhere!!</a> 
</div> 

<a href="#">I am not colourful!!</a> 

編輯

好吧,嗯,我知道你的問題錯了。所以你可以使用jQuery來實現。爲所有想要彩虹的鏈接添加一個類,並添加mouseenter和mouseleave事件處理程序。大概這個文檔會有幫助: jquery.mouseover()

+0

嗨,謝謝你的回答。我不確定你明白我的意思。鏈接不僅僅是一種純色,它閃爍着所有彩虹色,這就是爲什麼我需要JavaScript的原因,而不是簡單的CSS。 – overlappin

+0

我找到了一種方法。非常感謝你的幫助:) – overlappin

+0

不客氣! :)我也學到了另一種方式.. – Nil

相關問題