This snippet shows the details like Tagname, type, ID, Style and Global style, when the mouse is moved over any element of a page, which need to be traced otherwise only in the source file.
The code can be added in a script block or saved as a js file and referred in the head section. A model html file in whatisit.zip demonstrates the use.
jayakodiu@yahoo.com
Code:
document.onmousemove=function(){var ele=event.srcElement;tt=ele.tagName;if(tt=="BODY"){return}
if(tt=="INPUT"){tt+="\ntype = "+ele.type}
tid=ele.id;if(tid!=""){tt+="\nid = "+tid}
tcs=ele.style.cssText;if(tcs!=""){tt+="\nStyle:"+"\n"+ele.style.cssText}
zt="";if(document.styleSheets.length>0){sn=document.styleSheets(0).rules.length;zt=""
for(i=0;i<sn;i++){dn=document.styleSheets[0].rules[i].selectorText
if(ele.tagName==dn){zt="\nGlobal style Defn:\n"+document.styleSheets[0].rules[i].style.cssText}}}
ele.title=tt+zt}