38 users online (2 members and 36 guests)  

Thread: involvng images


  Results 1 to 9 of 9

Related

  1. Images?    Forum: HTML Forum
    Replies: 1
  2. images images...    Forum: HTML Forum
    Replies: 1
  3. Help with images    Forum: HTML Forum
    Replies: 6
  4. Images    Forum: HTML Forum
    Replies: 1
  1. #1
    cokesodanotd's Avatar
    Junior Member

    Status
    Offline
    Join Date
    Apr 2004
    Posts
    56

    involvng images

    I was wondering if its at all possible to line an ifrome (i think) with images so that it looks like 1 image but with a hole in it where there is information, like if i were to make a picture of a box would i be able to either divide it up or cut a hole in the picture where i could put information? (hope that makes sense...its late and i think my brain has shut down)

  2. #2
    QuietDean's Avatar
    Administrator

    Status
    Offline
    Join Date
    Oct 2000
    Location
    Bournemouth, UK
    Posts
    2,662
    Hiya,

    Yes, you could do this. The easiest way is to cut up your image into 9 segments, leaving the middle one out. You could then use a table to arrange the image slices around the middle table cell, which would contain your iframe.

    For processes like this, its easy if your using Dreamweaver or similar. DW can integrate with Fireworks image editor to import easily. But then again, its not too difficult to do by hand, either.
    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?

  3. #3
    cokesodanotd's Avatar
    Junior Member

    Status
    Offline
    Join Date
    Apr 2004
    Posts
    56
    alright i sorta have it, i've got all the pictures but i devided it differently (tell me if i should just stick with 9 cells) anyways, it sorta works and sorta doesn't, the site is

    http://www.freewebs.com/kb82/579.htm

    i'm not sure how i would alter the code, its supposed to look like a folder, the original image is

    http://img.photobucket.com/albums/v149/Victimsofyourinsanity/folder.bmp

    and its supposed to have a large area cut out, i'm not sure how i would alter the code to make it so it all fit together and looked like 1 picture with that large portion cut out, if you can help me, thank you!

  4. #4
    QuietDean's Avatar
    Administrator

    Status
    Offline
    Join Date
    Oct 2000
    Location
    Bournemouth, UK
    Posts
    2,662
    No, you don't have to stick to 9. In my head, 9 made sense but however many work for you is fine.

    You need to define the cells so they are as big as each image, using width= etc. Then it should all 'fit together'.
    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?

  5. #5
    HTML's Avatar
    Administrator

    Status
    Offline
    Join Date
    Aug 2000
    Posts
    3,445

    Follow HTML On Twitter Add HTML on Facebook Add HTML on Google+ Add HTML on Linkedin Visit HTML's Youtube Channel
    HTML Code:
    <table border="0" width="80%" cellpadding="0" cellspacing="0">  
    <tr> 
    <th colspan="1" width="10%"><img src="http://img.photobucket.com/albums/v149/Victimsofyourinsanity/foldertopl.bmp"></th>
    <th colspan="1" width="80%"><img src="http://img.photobucket.com/albums/v149/Victimsofyourinsanity/foldertopm.bmp"></th>
    <th colspan="1" width="10%"><img src="http://img.photobucket.com/albums/v149/Victimsofyourinsanity/foldertopr.bmp"></th>
    </tr>
    <tr>
    <td><img src="http://img.photobucket.com/albums/v149/Victimsofyourinsanity/foldermiddlel.bmp"></td>
    <td></td>
    <td><img src="http://img.photobucket.com/albums/v149/Victimsofyourinsanity/foldermiddler.bmp"></td>
    </tr>
    <tr>
    <th colspan="3" align="left"><img src="http://img.photobucket.com/albums/v149/Victimsofyourinsanity/foldebottom.bmp"></th>
    </tr>
    colspan1 is not needed in any th tags

    close the table with </table>

    Dave

  6. #6
    cokesodanotd's Avatar
    Junior Member

    Status
    Offline
    Join Date
    Apr 2004
    Posts
    56
    i just figured it out, i was using a percentage width and not pixels, thanks!

    and thank you for pointing out i dont need colspan="1" that will make things a little neater

  7. #7
    cokesodanotd's Avatar
    Junior Member

    Status
    Offline
    Join Date
    Apr 2004
    Posts
    56
    alright. i'm back with a little problem with the tables (i think) anyways, i made it so that they linked using an image map or whatever you'd like to call it, where the link is at a certain part of the picture using coordinates and such, well now the picture has some gaps in it, its on a different site now

    http://www.freewebs.com/victimsofyourinsanity/media.htm

    i was wondering if you could figure out a way to fix this, if you can, thank you, if not, thanks anyway

  8. #8
    HTML's Avatar
    Administrator

    Status
    Offline
    Join Date
    Aug 2000
    Posts
    3,445

    Follow HTML On Twitter Add HTML on Facebook Add HTML on Google+ Add HTML on Linkedin Visit HTML's Youtube Channel
    I added size attributes to the <td> and <img> tags and cleaned up a couple of spaces which were causing the gap, as well as added a couple of border="0".


    edit: oops, you want the code I bet

    HTML Code:
    <table width="535" cellpadding="0" cellspacing="0" border="0">  
    <tr>
    <th width="82"><img border="0" src="http://img.photobucket.com/albums/v149/Victimsofyourinsanity/foldertopl.bmp" usemap="#topleftmap" height="78" width="82"><map id="topleftmap" name="topleftmap"><area shape="rect" coords="11,5,73,29" alt="Downloads" href="downloads.htm" target="media"></th>
    <th width="369"><img border="0" src="http://img.photobucket.com/albums/v149/Victimsofyourinsanity/foldertopm.bmp" usemap="#topmiddlemap" height="78" width="369"><map id="topmiddlemap" name="topmiddlemap"><area shape="rect" coords="11,5,73,29" alt="Music" href="Music.htm" target="media"><area shape="rect" coords="93,6,156,29" alt="Videos" href="Videos.htm" target="media"></th>
    <th width="84"><img border="0" src="http://img.photobucket.com/albums/v149/Victimsofyourinsanity/foldertopr.bmp" height="78" width="84"></th>
    </tr>
    <tr>
    <td width="82"><img src="http://img.photobucket.com/albums/v149/Victimsofyourinsanity/foldermiddlel.bmp" height="253" width="82"></td>
    <td width="369"><iframe name="media" src="mediaexpl.htm" width="369" height="253"></iframe></td>
    <td width="84"><img src="http://img.photobucket.com/albums/v149/Victimsofyourinsanity/foldermiddler.bmp" height="253" width="84"></td>
    </tr>
    <tr>
    <td colspan="3" align="left" width="535"><img src="http://img.photobucket.com/albums/v149/Victimsofyourinsanity/foldebottom.bmp" height="38" width="535"></td>
    </tr>
    </table>
    Dave
    Last edited by HTML; 11-07-2004 at 12:38 AM.

  9. #9
    cokesodanotd's Avatar
    Junior Member

    Status
    Offline
    Join Date
    Apr 2004
    Posts
    56
    THANK YOU SO MUCH!!!!!!!!!!!!!!!!!!!!
    *is a little hyper and excited, and that brownie in front of me doesn't help*



Tags for this Thread