How do I add an image where user clicks?

Question

I want to add an image exactly where a user clicks. I have this so far, but it just adds the image to the top and just keeps adding it there...not where the user is clicking

  <html>
    <head>
        <script type="text/javascript">
            function stamp(d,e)
            {
                var i = new Image();
                i.src = 'smiley.jpg';
                document.getElementById('target').appendChild(i);
                //document.getElementById('target').style.left = "100px";  //e.clientX ;
                //document.getElementById('target').style.right = "1000px"; //e.clientY;
            }

</script>
</head>
<body id="target" onclick="javascript:stamp(this,event);" style="left: 100px">

</body>
</html>

Answer 1

window.onclick = function(event) {
    var i = new Image();
    i.src = 'http://jsfiddle.net/img/logo.png';
    i.style.position = "absolute";
    i.style.left = event.clientX + 'px';
    i.style.top = event.clientY + 'px';

    event.target.appendChild(i);
}

Example

How do I add an image where user clicks?

Question

1 answers

solution1
6 2011-10-18 03:10:25

How do I add an image where user clicks?

Question

1 answers

solution1 6 2011-10-18 03:10:25

solution1
6 2011-10-18 03:10:25