[SOLVED] Grab two attributes with onclick

[Bricktop]

Hello ppl!

 

OK, so I have a very simple image gallery system I have built using JCarousel.  I have modified the orginial code using a tiny piece of Javascript so when a user clicks on a thumbnail image in the JCarousel window, the main image is loaded in a DIV below.  This works fine and the code is as follows:

 

HTML:

<a href="mydomain/myimage.jpg" onclick="showPicture(this); return false;" alt="picture description">

 

JAVASCRIPT:

function showPicture(whichpicture) {
var source = whichpicture.getAttribute("href");
var placeholder = document.getElementById("placeholder");
placeholder.setAttribute("src",source);
}

 

Further down the HTML page I have:

<img id="placeholder" src="" alt="Image Viewer" />

 

This is where the clicked Thumbnail image gets placed.  Like I said, this works fine but each image has a different description and I would like to be able to pass this to a DIV and display it when the image is clicked.

 

I just wonder if anyone knows how to grab both the ALT attribute and pass to another DIV, I tried amending the above Javascript to:

function showPicture(whichpicture) {
var source = whichpicture.getAttribute("href");
var placeholder = document.getElementById("placeholder");
placeholder.setAttribute("src",source);

             var source2 = whichpicture.getAttribute("alt");
var placeholder2 = document.getElementById("placeholder2");
placeholder2.setAttribute("content",source);
}

 

I then created a new DIV called "placeholder2" with an attribute of "content" and the data was not passed.

 

Any ideas?  Is this even possible?

 

Thanks

[Bricktop]

Answered on another forum thanks, for anyone interested modify the JS to be:

 

function showPicture(whichpicture) {
var source = whichpicture.getAttribute("href");
var placeholder = document.getElementById("placeholder");
placeholder.setAttribute("src",source);

var source2 = whichpicture.getAttribute("alt");
var placeholder2 = document.getElementById("placeholder2");
// clear current content
while(placeholder2.hasChildNodes()){
	placeholder2.removeChild(placeholder2.firstChild);
};
// add content
placeholder2.appendChild(document.createTextNode(source2));
}