Web Analytics Made Easy -
StatCounter positioning an image - CodingForum

Announcement

Collapse
No announcement yet.

positioning an image

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • positioning an image

    Hi, i have an image i want to position to a certain spot. Can someone look at my html and tell me what i need to change? The image is the words creation index. The way it is now it gets big. The image is actually alot smaller then what displays on the webpage. Here is my website www.creationindex.com. Thanks

  • #2
    Hi there Repatilian,

    I have condensed your code a little.
    Code:
    
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
       "http://www.w3.org/TR/html4/strict.dtd">
    <html lang="en">
    <head>
    <base href="http://www.creationindex.com/">
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <meta name="language" content="english"> 
    <meta http-equiv="Content-Style-Type" content="text/css">
    
    <title>Creation Index</title>
    
    <script type="text/javascript">
    
       var preloads=[];
    function preload(){
    for(var c=0;c< arguments.length;c++) {
       preloads[preloads.length]=new Image();
       preloads[preloads.length-1].src=arguments[c];
    
      }
    
     }
    preload('logospintest.gif','backgroundgreen.gif','lineback.gif','lettering.gif');
    
    function init(){
    
    /* this value is 4 seconds, which is the time that logospintest.gif takes to run it's course */
    
       var delay=4250;
    
    /*********************************************************************************************/
    
       setTimeout(
       function(){
       document.getElementById('backgroundgreen').className='';
       document.getElementById('lineback').className='';
       document.getElementById('lettering').className='';
       },delay 
       );
     }
       window.addEventListener?
       window.addEventListener('load',init,false):
       window.attachEvent('onload',init);
    </script>
    
    <style type="text/css">
    body {
        margin:0px;
        background-color:#000;
     }
    #images {
        position:relative;
     }
    #images img {
        width:100%
     }
    #images #lettering,#images #lettering1 {
        width:60%; /*  adjust this value to suit your requirements  */
        left:20%;  /*  this value=(100%-width value)/2  */
     }
    #backgroundgreen,#backgroundgreen1,
    #lineback,#lineback1,
    #lettering,#lettering1 {
        position:absolute;
        top:0;
        left:0;
     }
    .hide {
        display:none; 
    }
    </style>
    
    </head>
    <body>
    
    <div id="images">
    
     <img src="logospintest.gif" alt="">
     <img id="backgroundgreen" class="hide" src="backgroundgreen.gif" alt=""> 
     <img id="lineback" class="hide" src="lineback.gif" alt=""> 
     <img id="lettering" class="hide" src="lettering.gif" alt="">
    
    <noscript>
    <div>
     <img id="backgroundgreen1" src="backgroundgreen.gif" alt=""> 
     <img id="lineback1" src="lineback.gif" alt=""> 
     <img id="lettering1" src="lettering.gif" alt=""> 
    </div>
    </noscript>
    
    </div>
    
    </body>
    </html>
    
    
    coothead
    ~ the original bald headed old fart ~

    Comment


    • #3
      Coothead, i have to say thank you so much for all your help. The code works perfectly. What i'm actually making is a forum website. I'm just gonna learn as i go. I sent you a friend request. I want to have a website that's pretty good graphically. If there's anyway i can help you out lemme know. I have coreldraw so i do alot with it. Thanks again.

      Comment


      • #4
        Hi there Repatilian,
        If there's anyway I can help you out lemme know
        You are already helping me out.
        I am a compulsive problem solver and your needs provided a temporary fix for my addiction.

        coothead
        Last edited by coothead; Aug 26, 2011, 06:55 AM.
        ~ the original bald headed old fart ~

        Comment

        Working...
        X