如何改变这个插件的lightbox2箭头位置？

Question

我正在使用Lightbox2插件http://lokeshdhakar.com/projects/lightbox2/。我需要：

1. 始终显示导航箭头
2. 箭头显示在浏览器的左侧和右侧，如float：left，right（不在图像上）
3. 关闭按钮显示在浏览器右上方位置

请帮助我，如何做到这一点。谢谢

Answer 1

要始终显示导航箭头，您必须将其opacity更改为1（默认情况下为0）。

下面：

＆＃13;

＆＃13;

.lb-nav a.lb-prev, .lb-nav a.lb-next {
  opacity: 1;
}

＆＃13;

＆＃13;

＆＃13;

然后，为了让它们保持在浏览器窗口的一侧，您可以更改position属性更改为fixed，然后相应地更改单个箭头，如下所示：

＆＃13;

＆＃13;

.lb-nav a.lb-next {
  position: fixed;
  right: 0;
  top: 0;
}
.lb-nav a.lb-prev {
  position: fixed;
  left: 0;
  top: 0;
}

＆＃13;

＆＃13;

＆＃13;

最后你可以通过弄乱这样的定位来移动整个底部块：

＆＃13;

＆＃13;

.lb-dataContainer {
  left: 50%;
  position: absolute;
  top: -45px;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}

＆＃13;

＆＃13;

＆＃13;

请记住，这些解决方案远非完美。这是一种快速而又脏的方式来移动元素。