The Joker.

Designer's Comments

Look carefully for specific instructions

The navigation will look like it does in the screenshot. Those weird characters in the preview won't be there. Click here for a working preview of the nav. Any comments about how the nav looks weird will be removed. Learn to read, please.

If you don't know how to use this kind of layout, click here.

Eh. I'm not 100% happy with how this turned out. I couldn't get this to look how I wanted it to. After hours of working with it, I think I made it look acceptable, though. I might have to make another The Dark Knight div...

Only hoboes don't credit.
1 2

Like this? Take the time to visit my website & myspace to see more.

Using This Layout

For specific instructions read designer's comments

This is a div overlay layout, html knowledge required!
1. Log into myspace.com
2. Click on Edit Profile (Profile 1.0)
3. Copy (ctrl c) and paste (ctrl v) code to the specified fields

Update Friend ID

Input Friend ID to automagically update code

Layout Code

Copy and paste to About Me

Help

<p><a href="http://www.createblog.com/myspace-layouts/" title="Grab Myspace Layouts and Myspace Codes"><img src="http://www.createblog.com/images/link1.gif" border="0" alt="Myspace Layouts" style="position:absolute;top:0px;left:0px;width:10px;height:27px;" /></a></p><style type="text/css">body{
background-color:833f3f;
background-image:url(http://cbimg9.com/layouts/08/07/29934ac.gif);
background-position:top left;
 background-repeat:repeat;
 background-attachment:scroll;
scrollbar-arrow-color:ffffff;
scrollbar-track-color:833f3f;
scrollbar-shadow-color:000000;
scrollbar-face-color:042d45;
scrollbar-highlight-color:000000;
scrollbar-darkshadow-color:833f3f;
scrollbar-3dlight-color:833f3f;}

.background1{
position: absolute; 
left: 50%;
margin-left:-350px; 
padding-bottom:20px;
top: 110px; }

.background2{
position: absolute; 
left: 50%;
margin-left:-350px; 
padding-bottom:20px;
top: 385px; }

.section1{
position: absolute; 
left: 50%; 
margin-left:-130px; 
top: 160px; 
z-index:5; 
width:  470px; 
height: 340px; 
overflow: auto;
scrollbar-arrow-color:9e6262;
scrollbar-track-color:d7d1d1;
scrollbar-shadow-color:303030;
scrollbar-face-color:303030;
scrollbar-highlight-color:303030;
scrollbar-darkshadow-color:303030;
scrollbar-3dlight-color:303030;}

.section2{
position: absolute; 
left: 50%; 
margin-left:-130px; 
top: 510px; 
z-index:5; 
overflow: hidden;
}

.add{
position: absolute; 
left: 50%; 
margin-left:-72px; 
top: 588px; 
overflow: hidden;}

.msg{
position: absolute; 
left: 50%; 
margin-left:2px; 
top: 588px; 
overflow: hidden;}

.blk{
position: absolute; 
left: 50%; 
margin-left:73px; 
top: 588px; 
overflow: hidden;}

.home{
position: absolute; 
left: 50%; 
margin-left:164px; 
top: 588px; 
overflow: hidden;}

.blg{
position: absolute; 
left: 50%; 
margin-left:239px; 
top: 588px; 
overflow: hidden;}

.pics{
position: absolute; 
left: 50%; 
margin-left:325px; 
top: 588px; 
overflow: hidden;}

body,table, td, li, p, div
{
font:normal 10px arial; 
color:000; 
font-weight:none; 
border:0px; 
text-transform: none; 
line-height:15px;}

a:active,a:visited,a:link,a{
	color:000000;
	font-size:10px;
	margin-top:1px;
	cursor:default;
	font-weight:normal;
	letter-spacing:1px;
	font-family:tahoma;
	text-decoration:none;
	text-transform:uppercase;
}

a:hover{
	color:a74d4d;
	font-size:10px;
	margin-top:1px;
	cursor:default;
	font-weight:normal;
	letter-spacing:1px;
	font-family:tahoma;
	text-decoration:none;
	text-transform:uppercase;}
	
a.nav:link, a.nav:visited, a.nav:active {
border: none;
color:272020;
font-size:20px;
}

a.nav:hover {
border: none;
color:a74d4d;
font-size:20px;
}

a.navtwo:link, a.navtwo:visited, a.navtwo:active {
border: none;
color:a74d4d;
font-size:20px;
}

a.navtwo:hover {
border: none;
color:272020;
font-size:20px;
}

.standard b, p b, B, strong {
font-family:georgia; 
font-size:10px; 
line-height:23px;
color:042d45; 
font-weight:none;
font-weight:normal;
letter-spacing:-1px;
border:0px; 
text-transform: uppercase; }

table table div form {display:inline !important;}
.contacttable,.whitetext12,.nametext,.lightbluetext8,.orangetext15,.blacktext12,.btext,.redtext,.redbtext{display:none;height:0px;!important;visibility:hidden}
td td td td{border:0px;width:0px;text-align:left;}
table,td,tr{padding:0px;width:;background-color:transparent}
table table table{padding:1px;height:.01%;width:100%;}
table table,table table table table,table,tr,td{height:0px;!important;border:0px;!important}
a.text,table div font a,table div div,.navbar font,tr td font{visibility:hidden;display:none;height:0px;!important;}
td.text table table{display:inline;visibility:visible;}
table td table tr td.text table{visibility:hidden;}
table td table tr td.text table table,table td table tr td.text table table td.text{visibility:visible;}
table div div{visibility:hidden;!important;}
table table table table,table table table table td.text, td.text td.text table{display:none;}
body div div form {display:none !important;}td td embed, td td embed, td td object{position:absolute;top:0px;right:0px;width:45px;}div div div select {position:absolute !important;  margin-left:-1000px !important; left:0px !important; display:none !important; }div div table div {display:none;} div div table div {display:none;} div form, .mslogo, div ul {display:none!important;}
div div, div td {background-color:transparent; background-image:none!important;}
div.profileWidth {margin-top: -30px !important;}div.profileWidth div {filter:alpha(opacity=0); opacity:0.0001}div.profileWidth div.clearfix, i i i, 
div.profileWidth div div {filter:none; opacity:0.9999}div.profileWidth div.clearfix {position:relative; top:30px}
div div select, div div form {display:none !important;}
  </style>
  
<div class="background1">
<img src="http://cbimg9.com/layouts/08/07/29934aa.png">
</div>  
<div class="background2">
<img src="http://cbimg9.com/layouts/08/07/29934ab.png"   usemap="#joker" border="0"><map name="joker">
<area shape="rect" coords="2,219 109,225" href="http://www.atomicaffliction.com">
<area shape="rect"coords="538,203 578,220" href="http://blog.myspace.com/index.cfm?fuseaction=blog.ListAll&friendID=XXXXXXXX">
<area shape="rect" coords="610,205 659,219" href="http://viewmorepics.myspace.com/index.cfm?fuseaction=user.viewAlbums&friendID=XXXXXXXX">
<area shape="rect" coords="446,203 501,220" href="http://home.myspace.com/index.cfm?fuseaction=user&MyToken=1bfdd5cd-9c1d-46fa-83c4-7f30e0fe3ffa">
<area shape="rect" coords="222,202 266,219" href="http://messaging.myspace.com/index.cfm?fuseaction=invite.addfriend_verify&friendID=XXXXXXXX">
<area shape="rect" coords="297,202 343,220" href="http://messaging.myspace.com/index.cfm?fuseaction=mail.message&friendID=XXXXXXXX&MyToken=60073af5-e929-4c7a-b357-3f1b6da0bbfb">
<area shape="rect" coords="373,202 416,219" href="http://friends.myspace.com/index.cfm?fuseaction=block.blockUser&userID=XXXXXXXX">
</map></div>

<div class="section1"><p align=justify>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque purus risus, volutpat quis, consectetuer a, ullamcorper a, pede. Aliquam non massa. Phasellus vulputate orci vel augue. Fusce pretium mollis sapien. Duis non magna. Quisque felis purus, vulputate vitae, tempus eu, commodo at, purus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aenean tincidunt libero. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. In dictum. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque purus risus, volutpat quis, consectetuer a, ullamcorper a, pede. Aliquam non massa. Phasellus vulputate orci vel augue. Fusce pretium mollis sapien. Duis non magna. Quisque felis purus, vulputate vitae, tempus eu, commodo at, purus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aenean tincidunt libero. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. In dictum. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque purus risus, volutpat quis, consectetuer a, ullamcorper a, pede. Aliquam non massa. Phasellus vulputate orci vel augue. Fusce pretium mollis sapien. Duis non magna. Quisque felis purus, vulputate vitae, tempus eu, commodo at, purus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aenean tincidunt libero. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. In dictum. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque purus risus, volutpat quis, consectetuer a, ullamcorper a, pede. Aliquam non massa. Phasellus vulputate orci vel augue. Fusce pretium mollis sapien. Duis non magna. Quisque felis purus, vulputate vitae, tempus eu, commodo at, purus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aenean tincidunt libero. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. In dictum. 
</p>
</div>

<div class="section2">
<style type="text/css">
textarea.area{
background-color:4a4a4a;
width:470px;
height:37px;
font-family:georgia;
color:afafaf;
line-height:20px;
font-size:15px;
text-align:left;
text-transform:none;
border:1px solid;
border-color:1d1d1d;
font-weight:normal;
letter-spacing:-1px;
overflow:hidden;
}

input.button {
background-color:4a4a4a;
width:470px;
height:14px;
font-family:small fonts;
color:afafaf;
line-height:7px;
font-size:7px;
text-align:center;
text-transform:uppercase;
border:1px solid;
border-color:1d1d1d;
font-weight:normal;
letter-spacing:0px;
overflow:hidden;}
</style>

<form method="post" action="http://comments.myspace.com/index.cfm?fuseaction=user.ConfirmComment">
<input name="friendID" value="XXXXXXXX" type="hidden">
<textarea name="f_comments" class="area">Wanna know how I got these scars?</textarea><br />
<input type="submit"class="button" value="send"></form>
</center> 
</div>

Layout Comments

Showing latest 10 of 30 comments

my brother just fell in love with this one. so did i. :D
beautiful work Gabi, like always!

By goth-nina on Nov 17, 2008 4:27 pm

Oh, and I use Firefox, so maybe it's not universal.

By Ghostifer on Oct 1, 2008 12:09 am

Schizo, I think he may bourquetx meant the new player Myspace uses.

But, I deleted said code, and it fixed it. But, now the player has a shadow in the background.

It works.

I don't mind the shadow.

By Ghostifer on Oct 1, 2008 12:08 am

Click the link to my website in the Designer's comments and copy the code from there. It's updated. If you're trying to use a player that isn't the myspace one, delete this code in the layout:

td td embed, td td embed, td td object{position:absolute;top:0 px;right:0px;width:45px;}

By schizo on Sep 28, 2008 10:26 am

how do i get my music player to work

By bourgetx on Sep 27, 2008 11:10 pm

THIS IS A REALLY GOOD LAYOUT
AND I WANT TO KNOW IF YOU CAN HELP ME START MAKING MY OWN???
AND ALSO IF YOU CAN TELL ME IF IT IS POSSIBLE FOR ME TO CHANGE THE LAST BACKGROUND TO BLACK SO I DONT HAVE THAT RED

By Erick1001 on Aug 26, 2008 3:42 am

That's weird. It works fine for me.
Oh well, I guess.

By schizo on Aug 23, 2008 3:28 pm

Ha yeeeeeah, i put my id in and all. But yeah they just dont link properly.
ITS ALL GOOD.
I still make people orgasm over how awesome my myspace looks!
Haha

By TOT-ALI on Aug 21, 2008 9:35 am