Results 1 to 5 of 5

Thread: How to replace an image with a new one?

  1. #1
    Join Date
    Jun 2010
    Location
    Milky Way
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Smile How to replace an image with a new one?

    Hi!

    I want a code for replacing an image with another one.

    Thanks!

  2. #2
    Join Date
    Jul 2009
    Location
    Binus University
    Posts
    472
    Thanks
    78
    Thanked 21 Times in 21 Posts

    Default

    what do you mean? You need to more specific describing your problem.
    _____________________

    David Demetrius // davejob
    _____________________

  3. #3
    Join Date
    Jun 2010
    Location
    Milky Way
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Smile

    The picture from here (the logo).
    I want to be different on a specific section of the forum, meaning here. As you can see, I've already put an image over, using this code:
    Code:
    <div style="position: absolute; top: 22px; left: 32px"><img src="http://friendsforever.co.cc/templates/fiblue3d/images/cellpic_fifa.jpg" border="0"></div>

    But it's not an optimal solution.
    I want a better solution. I've also tryed the following:
    Code:
    <script language="javascript">
    var objDoc = document.getElementsByTagName('img')
    var i
    var newImage = 'http://friendsforever.co.cc/templates/fiblue3d/images/cellpic_fifa.jpg'
    
    
    for (i=0; i<objDoc.length; i++) {
      if (objDoc[i].src.match(/cellpic_bkg/)){
        objDoc[i].src = newImage;
      }
    }
    </script>
    But it doesn't work.

  4. #4
    Join Date
    Jul 2010
    Location
    Denmark, Copenhagen
    Posts
    16
    Thanks
    0
    Thanked 3 Times in 3 Posts

    Default

    could you specify your question a bit? there's many ways to do it..

    example:

    HTML Code:
    <a href="javascript:void(0)"><img onMouseDown="this.src='http://i29.tinypic.com/2rddiqt.jpg'" onMouseUp="this.src='http://i32.tinypic.com/124f21v.jpg'" onMouseOver="this.src='http://i32.tinypic.com/zoavrm.jpg'" onMouseOut="this.src='http://i32.tinypic.com/124f21v.jpg'"  src="http://i32.tinypic.com/124f21v.jpg" /></a>

  5. #5
    Join Date
    Mar 2006
    Location
    Illinois, USA
    Posts
    12,164
    Thanks
    265
    Thanked 690 Times in 678 Posts

    Default

    I am also somewhat confused.

    I think what you are asking about is a basic form of templating. You want one image in one location and another in another location.

    There are two ways to do this:
    1. Just create two copies of your code and use one for one page, and the other for another.
    2. Use some programming language to replace the SRC of the image when in the other location. This cannot be done in HTML alone, or using CSS alone.

    If you want to use a programming language, then you can try two options:
    -Javascript: this requires that Javascript is available in the user's browser, and then you would check if the current URL contains the path like /mydirectory/; if so, change the SRC of the element by it's id. Using Javascript is possible for a beginner, perhaps the easiest way, but this code isn't exactly easy, though it's not very hard either. The hardest part is checking the URL to see if it contains the special directory.
    -PHP or another serverside language: while generating the page, you can add an if statement to check if the page is within /mydirectory/ like above. Then you would either output the original path or change it if the special directory was found. This is fairly simple, but requires that your server supports PHP or another serverside language, and programming in a serverside language can be harder to understand if you've never done it before (but it's very useful to learn). This does NOT require anything special from the user, and it will be completely hidden.
    Daniel - Freelance Web Design | <?php?> | <html>| español | Deutsch | italiano | português | català | un peu de français | some knowledge of several other languages: I can sometimes help translate here on DD | Linguistics Forum

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
  •