解決IE7以下版本不支援無A狀態偽類的幾種方法_經驗交流

在IE7以下版本一直是不支援無A狀態偽類的，通常都要靠Javascript來解決的，最近常有人問起這類問題，故整理了幾種方法，腳本來自國外網站，供大家參考。
方法一

javascript文件，來自Htmldog .

複製程式碼

複製程式碼

複製程式碼


程式碼如下:

function suckerfish(type, tag, parentId) {
    if (window.attachEvent) {
           var sfEls = (parentId== null)?document.getElementsByTagName(tag):document.getElementById(parentId).getElementsByTagName(tag);
            type(sfEls) }

sfHover = function(sfEls) {
    for (var i=0; i         this.className+=" sfhover" ;
        }
        sfEls[i].onmouseout=function() {  b"), "");
        }
    }
}

sfFocus = function(sfEls) {
    for (var i=0 s[i].onfocus= function() {
            this.className+=" sffocus";
                   this.className=this.className.replace(new RegExp(" sffocus\b"), "");
        }
    }
}

suckerfish(sfHover, "INPUTP. 🎜>suckerfish(sfHover, "p");



腳本可改動的部分 

   // , "INPUT"); 

   suckerfish(sfFocus, "INPUT"); 
   suckerfish(sfHover, "p")； { 
    background: #F8F8F8; 
    color: #333333; 
    put:hover,input.sfhover{ 
   background: #EEE; 
   color: #369; 
   border: 1px solid #069; 
   }    border: 1px solid #069; 
   } 
   p:hover,p.sfhover{ 
上面程式碼中第一個類別是給支援CSS2的瀏覽器，第二個是給IE6及以下版本的。要注意的是，你給某標籤設定了，那麼整個頁面內的這個標籤就會沿用同一個樣式。
方法二

javascript檔.




複製程式碼


程式碼如下:

var W3CDOM = (document.createElement && document.getElementsByTagName);
//window.onload = pinballEffect;

函數 pinballEffect()
{
    if (!W3CDOM) return;
    var allElements = document.getElementsByTagName('*');
    var originalBackgrounds=new Array();
    for (var i=0; i    {
            {
            allElements[i].onmouseover = mouseGoesOver;
            allElements[i].onmouseout = mouseGoesOut;
        }
    }
}

function mouseGoesOver()
{     this.className +=「 趴著」;
}

函數 mouseGoesOut()
{
    this.className = originalClassNameString;
}
pinballEffect();



腳本可照顧的部分

   1. if (allElements[i].className.indexOf('hovereffect') !=-1)
CSS

   1. .hovereffect{
   2.背景：#CCC;
   3. }

在需要應用效果的地方用class="hovereffect"呼叫。這類東西，行為和結構不分離，不建議使用。