Javascript将图像放在另一个上面

Question

我有以下来源，我想要做的是如果输入某个代码就会出现一个图像。诀窍是我需要将图像放在另一个图像的顶部。有什么办法吗？

var roomCode = prompt("Please enter the room code", "Enter room code here");
        if(roomCode==='102')
        {
            /*I want the image to appear at certain coordinates (on top of another image).*/
        }

Answer 1

只需用新图片的路径替换上一张图片的src属性。

示例：

HTML

<img id="replacable-img" src="http://www.wallpaperfunda.com/wp-content/uploads/2014/03/images-2.jpg" width="400px" alt="Original image">
<button id="change">Next Image</button> // Just example trigger

的Javascript

var img = document.getElementById('replacable-img');
var button = document.getElementById('change');

change.onclick = function(e) {
  img.setAttribute('src', 'http://www.wired.com/images_blogs/wiredscience/2012/10/kitten-kisses-dog.jpg')
}

在每个element.setAttribute('src', 'PATH')块中使用if：）

这是一个例子：http://jsbin.com/cefutaqo/1/

Answer 2

最初创建一个html页面甚至是图像。 将图像显示属性设置为无。

试试这个，

var roomCode = prompt("Please enter the room code", "Enter room code here");
        if(roomCode==='102')
        {
              load(roomCode+".html");
              $('.image').css('display',block)
        }