CODEWITHSUNDEEP
javascript
Muhammad Zubair
Muhammad Zubair

Reputation: 31

How do I add an image where user clicks?

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>

Upvotes: 3

Views: 84

Answers (1)

Joe
Joe

Reputation: 82594

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

Upvotes: 6

Related Questions