Logo 
Search:

Sharepoint Forum

Ask Question   UnAnswered
Home » Forum » Sharepoint       RSS Feeds

Webpart to discover CSS tags

  Asked By: Nirmal    Date: Feb 26    Category: Sharepoint    Views: 1038

I know i've seen a web part somewhere that claims you can mouseover a
section of the page and it will tell you what css tag is being used by
sharepoint. Can anyone point me to it?

Share: 

 

2 Answers Found

 
Answer #1    Answered By: Janak Jadeja     Answered On: Feb 26

Well there is a reference here
www.sharepointcustomization.com/.../wss_cssguide
.htm

And there used to be the hover page  here
www.frontpagedevkit.com/.../themes-custom2.htm
ng_the_styles_that_change_key_elements but it seems to have disappeared!

 
Answer #2    Answered By: Jude Alston     Answered On: Feb 26

Can't seem to find the url anymore
(weblogs.ilg.com/.../222.aspx) and I
can't be bothered to go through wayback to see if it's there so here's
the javascript. Just put it into a content editor web  part.



<script language="jscript">

function IDInfo()

{

if (window.event.srcElement.tagName != null)

{

ststag.innerText = "<" + window.event.srcElement.tagName + ">";

}

else

{

ststag.innerText = "";

}

if (window.event.srcElement.id != null)

{

stsid.innerText = window.event.srcElement.id;

}

else

{

stsid.innerText = "";

}

if (window.event.srcElement.name != null)

{

stsname.innerText = window.event.srcElement.name;

}

else

{

stsname.innerText = "";

}

if (window.event.srcElement != null)

{

var currElem = window.event.srcElement;

var classTree = '';

do

{

if (currElem.className != null && currElem.className != '')

{

if (classTree != '')

{

classTree = currElem.className + "->" + classTree;

}

else

{

classTree = currElem.className;

}

}



currElem = currElem.parentElement;

} while (currElem != null);

stsclass.innerText = classTree;

}

else

{

stsclass.innerText = "";

}

}



window.document.body.onmouseover = IDInfo;</script>



<div style="border-style:solid;border-width:1px; width: 350px; height:
34px;

position: absolute; left: 600px; top: 41px; z-index:15;
padding-left:4px;

padding-right:4px; padding-top:2px; padding-bottom:2px;
background-color:#EEEEF4">

<p id="ststagtitle"><font face="Tahoma" id="ststagtitle">Tag: </font>

<font face="Tahoma"id="ststag"> </font>

</p>

<p id="stsidtitle"><font face="Tahoma" id="stsidtitle">ID: </font>

<font face="Tahoma"id="stsid"> </font>

</p>

<p id="stsnametitle"><font face="Tahoma" id="stsnametitle">Name: </font>

<font face="Tahoma"id="stsname"> </font>

</p>

<p id="stsclasstitle"><font face="Tahoma" id="stsclasstitle">Class:
</font>

<font face="Tahoma"id="stsclass"> </font>

</p>

</div>

 
Didn't find what you were looking for? Find more on Webpart to discover CSS tags Or get search suggestion and latest updates.




Tagged: