mySpace band page profile views import into div overlay

mySpace band page div overlay; import profile views into div overlay

I still recommend that instead of this solution, you find yourself a counter, from another site, and place that counter onto your page. But for those who feel they must have the profile-views field, from the default myspace page, you may use this solution.

WARNINGs:
1) This solution puts html in the headline. I expect myspace to quit allowing this at any time (they do not allow this on the standard page). For now it works on the band page.

2) This solution uses syntax with some obvious bugs in it. The headline field (whcih I used) does NOT have enough room to use all of the needed table close/open tags. I did test this in 3 browsers (IE, FireFox, Opera) and they all handled the missing tags by assuming I wanted to close them, when I closed their containing parent.

This solution has been tested on three browsers, and across multiple resolutions and dpi settings. It was tested with my own div overlay (underlay?) strategy.

It is very important that you keep the lines which set the px sizes for font size and line-height. You may change the px values However, I do not recommend changing px to any other sizing method. IF you choose to change the font and/or line-height size you will need to adjust the clip values as well.


Put the following code line in your Headline field

</table></table><table class=H><td><p><table><td>

Put the following code block with your style blocks. The end of the Influences is a good place.

<i class="off">! import Profile Views into Div Overlay
!-code author:Eileen <a href="http://spiff-myspace.blogspot.com/">myspace tutorials and customizing code
!-The below style block is to be used with code in the headline which does the following:
   - closes tables, opens table with class H, opens Paragraph, blances open and close tables
</i>
<style>
{! recover block of text next to and under profile image !}
table  table table.H, table table table.H table {display:block;}
{! remove what we can of the view pics videos links !}
table table table.H a {display:none;}

{! control hieght of text in our Paragraph !}
table.H p {visibility:visible; line-height:20px; }
{! control height of carriage return !}
table.H p br {display:inline; line-height:10px;}
{!-online now icon removed to prevent it from messing with spacing-!}
table.H p img, table.H div  {display:none;}

{! position 60px higher than you want the page views -!}
table.H {position:absolute; top:0px; left:0px; margin-left:0px; width:220px;
 z-index:9 !important }

{! clip off everything except the page views. !}
{! you may need to modify the below clip values !}
table.H p {position:absolute; clip: rect(80px, 180px, 110px, 0px); z-index:9 !important } 

{! style page views text.  Size effects above clip values !}
table table table.H td  {  color:maroon !important;  font-size:15px !important; font-weight:bold !important;}

{! insure our page views can show on top.   !}
div.myCoreDiv {z-index:0 !important; }
</style>

Notes on positioning
When positioning the page views:
- Measure from the page center, based on the complete page, not the core div. This element is NOT inside our core div, as our other content is. This means positioning will not be as accurate cross browser/resolution.

- The top px value needs to be HIGHER, than the desired location by the SAME amount you clipped off the top.


Some notes on use of clip
Sets the shape of the element. The valid shape value is: rect (top, right, bottom, left)
I do not believe it works with any other shapes (I had no luck using any other shape)
The element must be positioned absolute for it to work.
No coordinates need to be supplied, however position:absolute must be applied.

I have had luck with clip on element types
image (that is how my online now icon solution works)
paragraph

Supposedly it works on any element where overflow works. (I guess that means it works on tables in FireFox but not in IE :-).