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 8 of 8
  1. #1
    New to the CF scene
    Join Date
    Feb 2005
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Tables & iframes?

    Hi....I am completely ignorant about all this, so please bear with me, and if you can help I'll appreciate it more than you know.

    Ok, so I have this page with a table. After reading a lot of the posts in here, I know many of you don't recommend tables but I used it because it's EASY and I can't figure out all the language/protocols/whatever for CSS and I don't think my server supports SSI, which I probably wouldn't be able to figure out either

    Anyway, this table has 4 columns; the two outside ones have links and text. The two middle ones are for images. I have thumbnails in the left/middle one, and want to have a larger image appear in the right column when a thumbnail is clicked. I'd also like the larger image to be replaced when a different thumbnail is clicked (if that makes sense). The reason I want to do it this way is to keep the no right click thing intact without having to make a whole new html page for every image. (And yes, I know people are still going to steal images, I just want them to have to think about it a minute first).

    My question is, is this possible? And if so, how? AND if it is possible, where exactly do I put the code in the html? I've found some code for iframes but I have no idea where to put them and/or whether I have to somehow attach it to each thumbnail.

    Thanks in advance for helping if you can!

  • #2
    New Coder
    Join Date
    Feb 2005
    Location
    Texas
    Posts
    15
    Thanks
    0
    Thanked 0 Times in 0 Posts
    This can be accomplished with a little bit of javascript. It's used frequently on eBay. I don't know enough javascript to code it myself, and couldn't find one right away sorry. But I hope that helps your search, javascript is your best bet for this.
    Binary Invisions
    Where the Webmasters Go.
    www.binvisions.com

  • #3
    New to the CF scene
    Join Date
    Feb 2005
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Kurt@BInvisions
    This can be accomplished with a little bit of javascript. It's used frequently on eBay. I don't know enough javascript to code it myself, and couldn't find one right away sorry. But I hope that helps your search, javascript is your best bet for this.
    Thanks so much for replying Kurt....I guess my primary problem is that I don't know exactly where to put any codes that would make this thing happen. This one person in another bbs gave me this advice and code:

    yes put an iframe in the left cell and target your links to that iframe
    Code:
    <iframe height="#" width="#" name="images" frameborder="0" src="test.html"></iframe>

    and then your links will be:
    Code:
    <a href="blah.gif" target="images"><img src="image.gif" border="0"></a>

    offcourse change information like height and width to yours. And replace "test.html" with the url of the page page that you want to be open inside the iframe when you load the page.

    But I have no idea where to put it in the html thingyand the images automatically resize I thoughtso why do I have to put the size in there ....then I read some other stuff that said iframes are crappy and tables suck and now you're telling me Javascript is the only way to go and my ears are bleeding.... *whimper*

    Should I just bag it and call a professional, ya think? hehe

  • #4
    Senior Coder
    Join Date
    Nov 2003
    Location
    Minneapolis, MN
    Posts
    2,879
    Thanks
    2
    Thanked 65 Times in 56 Posts
    Quote Originally Posted by miriote
    But I have no idea where to put it in the html thingyand the images automatically resize I thoughtso why do I have to put the size in there ....then I read some other stuff that said iframes are crappy and tables suck and now you're telling me Javascript is the only way to go and my ears are bleeding....
    Okay, really not trying to sound rude here, but it sounds like you don't know anything about HTML. Which is fine, but for us to guide you through this means starting at the beginning and holding your hand through this entire process.

    Might I suggest starting at the beginning, and taking a little time to learn the basics? I should add I don't mean basics as in, "keep adding tables until it looks right," but real, true markup basics:

    http://htmldog.com
    http://www.w3schools.com

    And after you've got a handle on things we'd be glad to guide through some of the specifics. If I'm wrong, and you in fact know enough about HTML to make a webpage, and you just need a little guidance targeting an iframe or something then disregard this message

  • #5
    New Coder
    Join Date
    Feb 2005
    Location
    Texas
    Posts
    15
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Okay, using an iframe would work as well. Before I go any further, I highly suggest hiring a professional if you have bigger aspirations than this. If this is about all you need, then just do it yourself. Now, let me see if I can help you out.

    Create a page, something like pictures.html, and place it in the same directory as your current page.

    Now, go back to your main page with the table. In the column with the thumbnails insert all of the thumbnail images you are going to have. Right now, each should like something like:
    Code:
    <img src="imagename.jpg" width="X" height="Y">
    Change each of them to:
    Code:
    <a href="/images/imagename.jpg" target="images"><img src="imagename.jpg" width="X" height="Y"></a>
    Just make the path in the <a> tag the same as the src of the image. So you must change it for each image you have.

    Now, in the column you wish the fullsize images to appear (inbetween the <td> and </td> tags).. put:
    Code:
    <iframe height="#" width="#" name="images" frameborder="0" src="pictures.html"></iframe>
    Just make sure to change the dimensions.

    I hope that helps, and good luck. If you're looking to hire someone for furture projects, feel free to contact me and I can try to give you a price quote.
    Last edited by Kurt@BInvisions; 02-19-2005 at 04:14 AM.
    Binary Invisions
    Where the Webmasters Go.
    www.binvisions.com

  • #6
    New to the CF scene
    Join Date
    Feb 2005
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts
    lol.....you're not rude, Richard, you're right! I am a total novice but I have managed to get the page mostly done. I still have a lot of tweaking and shuffling to do, but I can do those things in the editor on the server. This image thing is the last thing I have to do that I have no clue about how.
    Anyway, here's the link if you want to see if there's an easy answer to this.

    http://www.badchair.net/entertainment.html
    PS. Don't click on the links, they lead to pages I'm not going to use

    I sure appreciate your input!

  • #7
    New to the CF scene
    Join Date
    Feb 2005
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Oh sorry Kurt, I guess I was typing when you posted

    Thank you for the help! I'm going to try it and I'll let you know!

  • #8
    New to the CF scene
    Join Date
    Feb 2005
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Kurt@BInvisions

    Change each of them to:
    Code:
    <a href="/images/imagename.jpg" target="images"><img src="imagename.jpg" width="X" height="Y"></a>
    Just make the path in the <a> tag the same as the src of the image. So you must change it for each image you have.


    Ok, I'm taking this one step at a time....I've just put some images in that column, and now they look like this:
    <img style="margin: 0px;" title="" height="36" alt="" src="/images/thumbs/117_small.gif" width="48">

    So do I change them to this?:
    <img style="margin: 0px;" title="" height="36" alt=""><a href="/images/thumbs/117_small.gif" target ="thumbs"> <img src="/images/thumbs/117_small.gif" width="48"> </a>

    Do I need to put that img in there if it wasn't in the original?

    Thanks


  •  

    Posting Permissions

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