Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New to the CF scene
    Join Date
    Dec 2006
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Coding a Paint Shop Pro Image As a Myspace Layout

    Okay Im Trying to figure this out

    Im interested in doing a layout like the example below
    http://profile.myspace.com/index.cfm...endid=17428205

    but not quite like that I have some thing in mind to like this I created just as an example of how I want it for myspace not a website

    http://home.cablelynx.com/~tmitchell...pbc/pbc21.html

    If anyone can help me please let me know Thanks

  • #2
    ess
    ess is offline
    Regular Coder
    Join Date
    Oct 2006
    Location
    United Kingdom
    Posts
    866
    Thanks
    7
    Thanked 30 Times in 29 Posts
    I am not sure I understand what you are after.

    Can you be more specific please...so we can help you out.

  • #3
    New Coder
    Join Date
    Dec 2006
    Posts
    23
    Thanks
    0
    Thanked 0 Times in 0 Posts
    He wants to turn the second link he provided into a functional myspace website I believe.

  • #4
    New to the CF scene
    Join Date
    Dec 2006
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Yea thats exactly what Im trying to do anybody know how to go about doing this?

  • #5
    New Coder dragon's Avatar
    Join Date
    May 2003
    Location
    Florida
    Posts
    99
    Thanks
    0
    Thanked 0 Times in 0 Posts
    It looks like the coder put instructions into the stylesheet for you. Here are all the Embedded Styles from that page. (I used Firefox with the Web Developer toolbar to get this.) I didn't really dig into it, but this should get you started. See what you can do with it.

    Code:
    BASIC INSTRUCTIONS:
    You can delete this section from the code if you don't need it, but it won't affect the looks of your profile in any way.
    
    For every div class (.div1, .div2, etc) you will notice a lot of common properties. To move the layer, use:
    ** margin-top to move it up and down
    ** margin-left to  move it left and right
    
    margin-left begins from the center of your page. If you set it to 0px, the top left corner of the div will be located in the center of the profile. If you want the layer in the center of your profile take the width of the div, divide it by 2, and multiply it by -1. (In other words, divide it by 2 and make it a negative number.) For example, your div is 400px wide. Give it a margin-left of -200px and the div layer will sit in the middle of the screen. Now, if you want to move it somewhere else, you will have to experiment with the position.
    
    margin-top should be no less than 150px since anything above that may overlap the MySpace advertisment.
    
    The rest is self explanatory, width for width,  height for height, colors and so on.
    
    Style and Format:
    The divs will automatically align everything to the center, in order to make the text and pictures aligned to right or left, look for "text-align:center;" and replace center with left, right, or justify.
    
    If you want your comments to flow automatically rather than have them stuffed in a scroll box, look for the comments selector, named .comt {} inside .comt, you will fine overflow:auto; change auto to overflow:none;
    
    To move the personal song player, look for the embed {}
    
    To add a background image to each div (box), add this to your div selector:
    
    background-image:url(URL to background);
    background-position:center center;
    background-repeat:repeat;
    background-attachent:scroll;
    
    
    Good Luck!
    
    bbz Overlay Model Generator v0.5
    bbzSpace dot com
    
    body {background-color:black; background-image:url("http://i4.photobucket.com/albums/y143/dacoldest/dcd.gif"); background-repeat:repeat; background-position:center center; background-attachment:fixed;}
    td, .text, div, input {color:white !important;}
    a {color:white !important;} img {border:0px;}
    table, tr, td {background:transparent; border:0px;}
    img, .contactTable { display:none; }
    .bbzContainer img, .comt img { display:inline; } 
    table div, td td td, table div div { visibility:hidden; }
    font, a, .bbzsc a { visibility:hidden; }
    marquee { visibility:visible !important; }
    
    .bbzComment { This is where you control the position of the player. }
    table table embed {display:block; width:202px; height:35px; position:absolute; top:0px; left:0px; visibility:visible;}
    table table table embed,  .bbzContainer div embed {position:static !important; width:auto; height:auto; }
    .text, table table table table a,
    table table table table div,table table table table div a {visibility:visible;}
    .bbzComment { You selected to hide comments. }
    .bbzsc { display:none; }
    .text, td.text td.text table, .contactTable, .lightbluetext8 {display:none;}
    table table, table table td {padding:0px; height:0px;}
    
    .div0 {
    background-color:grey; color:white;
    border:2px solid; border-color:white;
    width:800px; height:160px; overflow:auto;
    position:absolute; z-index:2; left:50%; top:0%;
    margin-left:-400px; margin-top:150px; text-align:center;
    visibility:visible;
    background-image:url(http://i4.photobucket.com/albums/y143/dacoldest/ChrisHicks_Design00.jpg);
    background-position:center center;
    background-repeat:repeat;
    background-attachent:scroll;}
    
    .div1 {
    background-color:74d6fd; color:74d6fd;
    border:2px solid; border-color:white;
    width:250px; height:500px; overflow:auto;
    position:absolute; z-index:2; left:50%; top:0%;
    margin-left:-400px; margin-top:330px; text-align:center;
    visibility:visible;}
    
    .div2 {
    background-color:000000; color:000000;
    border:2px solid; border-color:white;
    width:530px; height:240px; overflow:auto;
    position:absolute; z-index:2; left:50%; top:0%;
    margin-left:-130px; margin-top:330px; text-align:center;
    visibility:visible;}
    
    .div3 {
    background-color:000000; color:000000;
    border:2px solid; border-color:white;
    width:530px; height:240px; overflow:auto;
    position:absolute; z-index:2; left:50%; top:0%;
    margin-left:-130px; margin-top:590px; text-align:center;
    visibility:visible;}
    marquee { z-index:8; }
    table div, span, td td td, table div div { visibility:hidden !important; }
    .bbzContainer div, .bbzContainer div font, .bbzContainer div a, .bbzContainer div div, .bbzContainer font a, .bbzContainer span, .bbzContainer div table a, .bbzContainer div table img, .bbzContainer div table font, .bbzContainer div table, .bbzContainer div table td, .comt, .comt td, .comt span, .comt a, .comt div {visibility:visible !important;}
    
    .bbzDiv {content:"Overlay Generator beta";}
    
    object {position:relative; top:600; left:0px;}
    
    DIV {
    	VISIBILITY: visible
    }
    DIV TABLE {
    	VISIBILITY: visible
    }
    DIV TABLE TD {
    	VISIBILITY: HIDDEN
    }
    DIV TABLE TABLE TD {
    	VISIBILITY: visible
    }
    DIV TABLE TABLE {
    	VISIBILITY: visible
    }
    DIV TABLE TABLE DIV {
    	VISIBILITY: visible
    }
    TABLE TD DIV DIV {
    	VISIBILITY: visible
    }
    DIV TABLE {
    	VISIBILITY: visible
    }
    
    a .text 
     {
        font-weight: bold;
        font-family: Arial, Helvetica, sans-serif;
     }
    
    body, html {visibility:visible !important; display:block !important}
    Last edited by dragon; 01-12-2007 at 03:49 AM.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •