simple div overlay Options

[*disco infiltrator*]

Here's a simple Myspace div overlay.

For your CSS, use one of the CSS stylesheets already provided. Put that in your "About Me".

For your content, you can use this. Put it in "Who I'd Like to Meet":

CODE

<div class="bg" style="position: absolute; left:0px; top:0px; width:000px; height:000px; overflow: hidden;">
<img src="IMAGEURLHERE">
</div>

<div class="content" style="position: absolute; left:000px;  top:000px; width:000px; height:000px; overflow: auto;"><center>
lalalalala this is your content!
</div>

For the image, you only need to change the width and the height to fit your image.

For the content, you can change the class of the div, the left alignment, top alignment, width, height, and overflow. If you want the div to have a scrollbar, use this div code. Open the image in Microsoft Paint to get the alignments.



If I wanted the div to begin where the black dot is, I would use the paintbrush tool and place it where I want the div to begin. Keep the mouse there, and look in the bottom right corner for two numbers separated by a comma. The first number is your left alignment, and the second is your top.

If I wanted a div that continues down the page until it runs out of content, this would be my div code:

CODE

<div class="bg" style="position: absolute; left:0px; top:0px; width:000px; height:000px; overflow: hidden;">
<img src="IMAGEURLHERE">
</div>

<div class="content" style="position: absolute; left:000px;  top:000px; width:000px; height:100%; overflow: visible;"><center>
lalalalala this is your content!
</div>

The only things that are changed are the height and overflow. Now all you need to worry about is the left alignment, top alignment, and width.

There you have it.

The following was contributed by tcunningham1589.


Description:

This code is used to make your simple div on your profile, whether you are using it for content, or a ghetto way to cover somthing up.



Code:

{ code used in INTERESTS section }
<style>
.div1 {
background-color:000000; color:000000;
border:0px solid; border-color:silver;
width:400px; height:100px; overflow:auto;
position:absolute; z-index:2; left:50%; top:0%;
margin-left:-250px; margin-top:150px;
visibility:visible;}
</style>

{ code used in MUSIC section }
<div class="div1">
content
</div>

*everything in bold is changeable

Positioning

Code:
quick lesson on "position: relative"
top: -45px = moves up 45px
top: 45px = moves down 45px
left: -15px = moves left 15px
left: 15px = moves right 15px

quick lesson on "position: absolute"
top: 0% = moves to top of page
top: 50% = moves to middle of page
top: 100% = moves to bottem of page
left: 0% = moves to left of page
left: 50% = moves to center of page
left: 100% = moves to right of page
margin-left: -15px = moves left 15px
margin-left: 15px = moves right 15px
margin-top: 45px = moves down 45px
margin-top: -45px = moves up 45px

For Myspace Band/Music Profiles:
http://www.createblog.com/forums/index.php...t&p=2624671

This post has been edited by digitalfragrance: Jul 12 2007, 01:04 AM

[x3_mr_mak]

wow great thanks! this will answer a lot of questions.

[DDOMINOO]

Good work "Headphones."

[*disco infiltrator*]

Thank you "DDOMINOO".

[D1SMANTLED]

I think this should be closed or else people are going to start asking questions in here.

Topic Closed.

EDIT: NVM

[*disco infiltrator*]

The whole point of having this is so there's not questions in topics in Myspace Help but they can ask here..

Topic reopened.

[YourSuperior]

What does 'Overflow' mean?

Your text or images will overflow.

[william]

ok..im stupid coz im new...but wat does "div overlay" mean?

div refers to div layer, which is kind of like a layer of html you "overlay" on your original profile so that you can completely customize your profile with whatever you want.

Quick Question, how do you hide the rest of your profile so that this works?

I tried using the script on the forums, but it didn't work.

you hide the original text classes and most of the tables, then make the div big enough so it covers what's left of your profile.

[snoox]

oh! domo. domoo. thanks "william"!

[*disco infiltrator*]

umm. ok im new at this but i wan to learn how to make a div layout. so does the image you make have to be a certain size or something?

What size would you make the MS Paint canvas?

It doesn't matter, any size you want that will cover the profile under it.

[toodlepops.]

Oh, thank you so much, Sammi.

[freeflow]

Sammi you are awesome!

[supjuls]

i read this thing over and over and over again, and i finally get it!!! haha yay :D just wanted to say thanx, this really helps!!!

[*disco infiltrator*]

hey sammi, is it possible to provide a div overlay layout code for myspace?

This is a div overlay layout code........

can you do image mapping on myspace?

Yes. Just use the same way to position as the way you position divs.

[FONT=Arial][SIZE=1]WOW SHEEESH THiS iS SUPER DUPER HARD!! i STiLL DONT GET iT BUHH YEA ANYONE WiLLiN TO HELP MEEE?? iF YA WANNA TAKE TiME TO HELP ME OUT STEP BY STEP iM ME @ AiM:sh0rtybmyname17 PLEASE YOUR HELP WiLL BE GREATLY APPRECiATED!!

It really isn't hard. This whole topic explains it step-by-step. What more could you need help with? Copy the code, position, change colors.....Really, it's not that hard.

[coolestdork12]

ahh this defenitely helps.

thank you sammi

[hotbabylisious]

wow thats realli helpfull

~*myspace*~

ill add u !!!!
i love commentting if u do to than maybe u shud add me

[william]

...this thread is open so you can ask specific questions petaining to this tutorial, not so you can ask someone to completely do it for you or to advertise your myspace.

[without a name]

i really dont get this can someone IM me and help me?


lilbabygurlkelly

[NotWorthMyTime9]

okay i just want to know if there is a div overlay for JUST getting rid of the main user picture/name/last login/country stuff?

[poisoncandygram]

I don't understand where to put the div code... If I start it above my content in "who I'd like to meet" and then [/div] it, it just multiplies my image over and over again and covers the entire background of the table. All I want is to position it over the extended network section... >_<

[lovescream]

whats the code to erase everything so you can make a div overlay?

Ehh.. http://www.createblog.com/forums/index.php?showtopic=87336 ?

Yeah completely covered the rest of my profile, so now i cant change it back

www.myspace.com/robbeh

Could someone help me?

^ Safe mode.

[hiddenanger]

ok i tried the code... but this is how my page turned out...

http://www.myspace.com/angerful

ok, i almost go the layout down... but... why is this happening?

[hottieondablock]

That is awesome! Thank you soo much! <3

[ihrtbz]

Hey, i used your code and everything. But i just can't put pictures and text on there. will you show me how?

use the image tags and just type text

like after your opening div tag
<img src="URL"></img>

or for text
<p> Blah blah blah.<br>Blah blah blah. </p>

[X_miss_kitty_X]

i'm really having a tough time with this...if anyone would like to coach me through it, please IM me on msn (very_berry_strawberries@hotmail.com) or yahoo (bad_kitty1638) i know i can do it if i just have a tiny bit of help