Reputation:
I have this function which gets some variables and adds shadow to them, and the displays them in a table.
My Question is, how can I add the table into the DIV, which I have on my page? It's probably really easy, just that Im new to javascript. Thanks!
function drpShadow(pic_url, width, height) {
var i;
var pic_display
= "<table border='0' style='display:inline;' cellspacing='0' cellpadding='0'><tr><td width='4px' height='" + height + "'><img src='/SV/Graphics/drop_shadow_top_left_corner_4x4.jpg'><br />";
for (i = 0; i < (height - 4); i++) {
pic_display += "<img src='/SV/Graphics/drop_shadow_left_4x1.jpg'><br />";
}
pic_display +=
"</td><td width='" + width +
"' height='" + height +
"'><img src='../temp_images/" + pic_url + "'></td></tr><tr><td colspan='2' height='4px' width='" + (width + 4) + "'><img src='/SV/Graphics/drop_shadow_left_bottom_corner_4x4.jpg'>";
for (i = 0; i <= (width - 6); i++) {
pic_display += "<img src='/SV/Graphics/drop_shadow_bottom_1x4.jpg'>";
}
pic_display
+= "<img src='/SV/Graphics/drop_shadow_right_bottom_corner_4x4.jpg'></td></tr></table>";
return pic_display;
}
Upvotes: 0
Views: 76
Reputation: 3074
You need to either use innerHTML or create the dom elements using the createElement function.
Apparently the first method is quicker but is not standard although most browsers support it. The second way is the way it should be done although this can be quite complicated. I have done it this way myself.
An easier way might be to use jquery with the append function.
Upvotes: 1
Reputation: 24832
document.getElementbyId("yourDivid").innerHTML += drpShadow(yourPicUrl,yourWidth, yourJeight);
Upvotes: 3