Question

我创建了一个模态窗口来显示图像。我想在模态窗口上添加右箭头和左箭头单击图像，但在显示它时遇到问题。

这是我的代码：

这里我们创建调光器（模态窗口）。 newelement是一个创建DOM元素的内部函数。在这种情况下，我们创建调光器元素，将其附加到document.body，然后应用一些样式速记（背景颜色，不透明度，过渡）

var dimmer=newelement("div",document.body,"bgc=#101010;op=0;tr=0.15s ease in");
dimmer.id="dimmer";

现在，我想在调光器上添加一个右键单击图像。我有一个固定的位置，左边是70％，顶部是50％，添加了一个盒子阴影，z-index为10003，不透明度为0。

var rclickimage=newelement("img",document.body,"p=f;l=70%;t=50%;bx=0 0 50px rgba(0,0,0,0.5);z=10003;op=0");
rclickimage.src='/img/007359-blue-jelly-icon-arrows-arrow-thick-right.png';

最后，这是渲染的图像本身。 你会注意到左边是50％而右边的图像是70％这个元素有一个固定的位置，左边是50％，顶部是50％，添加了一个框 - 阴影，z-index为10003，不透明度为0.

image=newelement("img",document.body,"p=f;l=50%;t=50%;bx=0 0 50px rgba(0,0,0,0.5);z=10003;op=0");
image.src="/services/attachment/"+mediaid+"/"+window.innerWidth+"x"+window.innerHeight;

这是在image加载时调用的onload函数：

image.onload=function(e) {
  this.onload=null;
  var ml=parseInt(this.width/2); var mt=parseInt(this.height/2);
  //margin left and margin top (ml and mt)
  setstyle(this,"ml=-"+ml+"px;mt=-"+mt+"px");
  animate(this,"opacity",1,0.2);  
   if (dimmer.spinner) { document.body.removeChild(dimmer.spinner);dimmer.spinner=0; }
}

就这样吧。 除了要显示右键图像

之外，一切都很有效

Answer 1

使用此行，您将创建一个具有0不透明度的图像。在此之后的任何时候，您似乎都没有将其更改为1的不透明度。

image=newelement("img",document.body,"p=f;l=50%;t=50%;bx=0 0 50px rgba(0,0,0,0.5);z=10003;op=0");

无法获取图像显示

1 个答案: