SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Member
    Join Date
    Oct 2006
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Using Javascript to replace images in html?

    Sounds weird, I know. I'm using this foto site, and you can use CSS to customize the pages. They told me it's possible to replace their stock logo using javascript or html snippets that are placed within different areas (similar to how you can paste these into MySpace changes and remove things). I can't figure out how to do this -- can anyone help me? This is the code that controls their image, the one I'm trying to remove. I found this by viewing the page source:

    Code:
    <!-- logo box -->
    
        <td width=172>
          <table height=94 cellSpacing=0 cellPadding=0 width=172 border=0>
            <TR><td class=logocell valign=middle width=172 height=74>               <a href="http://www.fototime.com/">                    <IMG height=65 alt="FotoTime"  src="/ftweb/images/common/ftlogo_gyb.gif" width=140 border=0  name=ftlogo_gyb>               </a>        </td></TR>
            <TR><td class=spacer width=172 height=1><IMG height=1 src="/ftweb/images/common/spacer.gif" width=172></td></TR>
            <TR><td class=leftcontent><IMG height=19 src="/ftweb/images/common/spacer.gif"  width=172></td></TR>
    	 </table>
    	 </td>
    The pages also accept custom CSS that can be assigned. Does that make this easier? I'm new to this.

    I appreciate it!!!

    -jonpertwee

  2. #2
    In memoriam gold trophysilver trophybronze trophy Dan Schulz's Avatar
    Join Date
    May 2006
    Location
    Aurora, Illinois
    Posts
    15,476
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Look for the <IMG> tag, then replace the filename of the image with the one you want to use. Also be sure to re-adjust the width and height of your images in the source code. Also, don't forget that you need to have the image in the same location or else the image won't show, unless you change the link to the image in question. Same thing for the file extension. If you have image.jpg and replace it with anotherimage.jpg but anotherimage.jpg is really a .gif file, it won't show up. So replacing anotherimage.jpg with anotherimage.gif will work, and your image will appear.

    If you can provide a link, I'll be able to point out where the changes need to be made, so you can take care of them.

    If you don't mind me asking, do you have any prior experience with HTML? If not you may want to read HTML, XHTML and CSS Visual Quickstart Guide, 6th Edition by Elizabeth Castro.

  3. #3
    SitePoint Member
    Join Date
    Oct 2006
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks for the quick response Dan!

    Okay, well. First, I can't change the actual html page -- I can only apply a CSS stylesheet, and the logo in question doesn't actually appear on the CSS, only on the HTML file that controls the page, which is locked away.

    According to the tech people, you can paste snippets of html into areas of the site when you're creating albums, and using javascript -- somehow put an image 'ontop' of the existing image.

    here is a link to one of their galleries, not mine -- but it gives you an idea of the html I'm dealing with:

    http://www.fototime.com/ftweb/bin/ft...-E5A8A7E69FD2}

    -- it's so ...ugly, the design of the page.

    I've been doing html and flash for awhile, but not dealing with css and tableless or javascript...really, much at all.

    Thanks for any insight, I will check out the book you mentioned.

    -jpertwee

  4. #4
    In memoriam gold trophysilver trophybronze trophy Dan Schulz's Avatar
    Join Date
    May 2006
    Location
    Aurora, Illinois
    Posts
    15,476
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The only thing that strikes me off the bat as of being possible would be to use JavaScript to create custom classes that you could then use for styling with CSS. The CSS would then take the class, hide the actual image, then load a background image over that. Even then, you'd probably have to use positioning and a z-index to stack the new image over the old one.

    I'm not much of a JavaScript user, and the scripting involved for this type of work would be rather complex.

    Frankly, if you really need to host images, I'd just get some Web space and install a photo gallery script like Coppermine if I were you.

  5. #5
    SitePoint Member
    Join Date
    Oct 2006
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hey,

    Thanks for the info Dan. This service is actually used for selling photos, so I would have to set-up an online store, order the prints, etc.

    Everything you mentioned sounds exactly like what I want to do, but it's totally confusing me. I'm not sure where to start.

    It's annoying, because their layout has that curved border, which -- it just is not possible to remove it.....bizzare.

    thanks again - jonpertwee


Bookmarks

Posting Permissions

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