dcsimg
www.webdeveloper.com
Results 1 to 7 of 7

Thread: img src

  1. #1
    Join Date
    Aug 2006
    Posts
    26

    Question img src

    Hello, I'm kind of new to javascript. I am trying to set the source path for an image programmatically using javascript but I can't seem to be able to get it to work. My HTML looks like this:

    <img id="work" src="javascript:GetImage();" alt="crap">

    My javascript function only has a call to alert() right now until I can get the HTML to call it but I get nothing. An ideas?

  2. #2
    Join Date
    Jul 2008
    Location
    urbana, il
    Posts
    2,787
    the javascript: protocol is not supported by all tags until HTML5 is out.

    you'll have to hard-code the src in the html attrib, or use javascript to set the .src attrib of the image element.

  3. #3
    Join Date
    Aug 2006
    Posts
    26
    when you say "use javascript to set the .src attrib of the image element" do you mean using something like "document.getElementById("work").src"? If so, how do I call this from inside the HTML?

  4. #4
    Join Date
    Jul 2008
    Location
    urbana, il
    Posts
    2,787
    Quote Originally Posted by moose151 View Post
    when you say "use javascript to set the .src attrib of the image element" do you mean using something like "document.getElementById("work").src"? If so, how do I call this from inside the HTML?
    it's have to be in a script tag.
    i guess some browsers might let you get away with putting it in an onerror or onload attrib of the img, but that's janky if you ask me.

  5. #5
    Join Date
    Oct 2009
    Posts
    4
    I hope this can help you. In this code, there are 2 images, and they are swapped when mouse is on the image. BUT, in the beginning, an image is already there.
    ---->script
    function swap(image, source){
    document.getElementById(image).src=source;
    }
    function restore(image, source){
    document.getElementById(image).src=source;
    }

    ------------>xhtml
    <a href="index.html" onmouseover="swap('homeimage','images/swap2.jpg');"
    onmouseout="restore('homeimage','images/swap1.jpg');">
    <img src="images/swap1.jpg" alt="home" id="homeimage"/>
    </a>

  6. #6
    Join Date
    Aug 2006
    Posts
    26
    Quote Originally Posted by nabeca View Post
    I hope this can help you. In this code, there are 2 images, and they are swapped when mouse is on the image. BUT, in the beginning, an image is already there.
    ---->script
    function swap(image, source){
    document.getElementById(image).src=source;
    }
    function restore(image, source){
    document.getElementById(image).src=source;
    }

    ------------>xhtml
    <a href="index.html" onmouseover="swap('homeimage','images/swap2.jpg');"
    onmouseout="restore('homeimage','images/swap1.jpg');">
    <img src="images/swap1.jpg" alt="home" id="homeimage"/>
    </a>
    Thanks for the response but it's actually the first image that I am having problems setting. I have code to swap the images when a link is clicked but I need the first image to get programmatically set as well. I tried setting it "onLoad" but it doesn't work, at least not in firefox.

  7. #7
    Join Date
    Jul 2008
    Location
    urbana, il
    Posts
    2,787
    Quote Originally Posted by moose151 View Post
    Thanks for the response but it's actually the first image that I am having problems setting. I have code to swap the images when a link is clicked but I need the first image to get programmatically set as well. I tried setting it "onLoad" but it doesn't work, at least not in firefox.
    why can't you set the first image's .src in the same place as the code to handle the clicks?
    i don't see why it must be done in the HTML part..

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles