ONCLICK....post new image in DIV

[Paul Williams]

from my spry sub.menu tab,
i'm trying to use "onclick" to post a new img in a specific div elsewhere on the page.

<li><a class="MenuBarItemSubmenu" href="#">CPQC</a>
<ul>
<li><a href="#" onclick="document.getElementById('cpqcRange').src='images/cpqc/cpqcHot.png';">Hot</a></li>
</ul>
</li>

<div id="cpqcRange">
<p>
<img src="cpqcLocation.png" alt="cpqcLocation" name="cpqcLocation" width="504" height="360" id="cpqcLocation" />
</p>
</div>

i think i'm close, but something is wrong.
can you just call up the div "cpqcRange" by name and slap a new img.src in there???????

cheers,
Paul

today's weather in Kalispell, MT, USA
cold, brrrrr, not much snow, but it's coming soon
it was about 18degF this morning

[Excavator]

Hello Paul Williams,
Maybe this simple js switcher would work for you - http://nopeople.com/CSS%20tips/new_e...her/index.html

You are colder in Kalispell than we are in Palmer today.

[teedoff]

Hi Paul, welcome.

Yeah thats gonna take some javascript. Anytime you want something in a webpage to "change" it will take something other than static html, which is very limited.

Since you just finished that Missing Manual book, WOW btw! lol

You should look into the built in snippets panel in DW where you can find lots of javascript code snippets.

[Paul Williams]

thanks Excavator, i'll check out the link

thanks Teedoff, i'll check into the snippets and start boning up on javascript.
i did find "showimage()" in javascript, but will have to chase it down and study the sintax.

[mvmacd]

Originally Posted by Paul Williams

from my spry sub.menu tab,
i'm trying to use "onclick" to post a new img in a specific div elsewhere on the page.

<li><a class="MenuBarItemSubmenu" href="#">CPQC</a>
<ul>
<li><a href="#" onclick="document.getElementById('cpqcRange').src='images/cpqc/cpqcHot.png';">Hot</a></li>
</ul>
</li>

<div id="cpqcRange">
<p>
<img src="cpqcLocation.png" alt="cpqcLocation" name="cpqcLocation" width="504" height="360" id="cpqcLocation" />
</p>
</div>

i think i'm close, but something is wrong.
can you just call up the div "cpqcRange" by name and slap a new img.src in there???????

cheers,
Paul

today's weather in Kalispell, MT, USA
cold, brrrrr, not much snow, but it's coming soon
it was about 18degF this morning

So when you click on something, you want to add a new image to a div?

Add jQuery to your page and try this:

<script type='text/javascript'>
$(document).ready(function () 
{ 

$('#TRIGGER').click(function () //change TRIGGER to the ID of the link.  Or you can make below this a function and call it with onclick
{
$('#cpqcRange').append("<img src='/path/to/image.jpg'>");
});


});
</script>

Easy as that. That will append the text to the end of the div that has the ID is cpqcRange.

If you want to change the src of an image already there:

$('#image').attr('src','/path/to/image.jpg');

[Paul Williams]

thank you Mvmacd

got it worked out.