24 users online (1 members and 23 guests)  


  Results 1 to 5 of 5

Related

  1. small programmes    Forum: Myspace Forum
    Replies: 1
  2. Help with a small counter    Forum: Javascript Forum
    Replies: 2
  3. a small dialog box:    Forum: Javascript Forum
    Replies: 2
  4. Small tutorial    Forum: Show it off!
    Replies: 1
  5. Small Bitmap over a Larger Bitmap    Forum: CSS Forum
    Replies: 1
  1. #1
    JOHN DIVJAK's Avatar
    New User

    Status
    Offline
    Join Date
    Mar 2002
    Location
    ATLANTA,GA
    Posts
    3

    Display small bitmap over a larger one

    Hello,
    I'm a VB programmer new to the HTML environment, and I don't know if it is possible to do the following... I am displaying a large bitmap in a web page using the IMG tag. I now want to place a small bitmat on top of the first one at pixel co-ordinate (x,y) 245,245. Is it possible to do this in HTML code or does one creat a Javascript to do this. Would you have a very simple sample on how this would be done?
    John

  2. #2
    benzden's Avatar
    Senior Member

    Status
    Offline
    Join Date
    Feb 2002
    Location
    San Antonio, Texas
    Posts
    652
    That appears to be a .css <STYLE ...> function. I've done in accidentally a few times with HTML but not enough to notice or remember exactly how - and it's not a controllable process in HTML. Post that in the CSS (vs this HTML) section of this Forum.

  3. #3
    Derek's Avatar
    Be Yourself

    Status
    Offline
    Join Date
    Aug 2001
    Location
    St. George, Utah, USA
    Posts
    466
    Definetly a CSS style question. Dean has some tutorials and I know it covers that I forget and don't wanna lookit up just look at his signiture and look around you'll find it.

  4. #4
    JOHN DIVJAK's Avatar
    New User

    Status
    Offline
    Join Date
    Mar 2002
    Location
    ATLANTA,GA
    Posts
    3
    benzden and Derek,
    I appreciate your advice. Will check with Dean!
    John

  5. #5
    QuietDean's Avatar
    Administrator

    Status
    Offline
    Join Date
    Oct 2000
    Location
    Bournemouth, UK
    Posts
    2,662
    Hi John.

    Hmm. I think CSS would be the most accurate way to do this.

    If you have not used any CSS before, quick intro -

    http://css.somepeople.net

    However, positioning is not covered much so here we go...


    CSS can access the position of any element. SO for you example -

    Code:
    <div style="position: relative;"> <!-- This 'fixes' the position of the div so we can use it as a ref point -->
    
    <img src="first_big_picture.jpg">
    
    <img src="smaller_floating_picture.jpg" style="position: absolute; left: 245px; top: 245px;">
    
    </div>
    When you use position: absolute; you are setting the coordinates from the top left corner of the containing element. Naturally, the containing element is the <body>, which is why we put it in a div and define the divs position.

    That code may work 'as-is', but without your images, its hard to tell. Have a play with it, let us know how you get on.

    Seeya,
    If one of our members helps you, please click the icon to add to their reputation!
    No support via email or private message - use the forums!
    Before you ask, have you Searched?



Tags for this Thread