不活动时不要使幻灯片内容变暗

Question

我是第一次使用 impress.js，想做一些调整。原始演示 SEEN HERE has the slides become dim/transparent when they are not active. I have seen another impress.js presentation SEEN HERE 其中 image/slides 在整个演示文稿中保持不透明，除了第一张幻灯片（之后所有内容都变得不透明）。如何使特定幻灯片或图像在整个演示过程中保持不透明？

Answer 1

在您的 css 添加

.future : { opacity: 1.0 !important;}
.past : { opacity: 1.0 !important;}

或编辑印象-demo.css

.impress-enabled .step {
  margin: 0;
  opacity: 0.3; <---  CHANGE THIS
  -webkit-transition: opacity 1s;
  -moz-transition: opacity 1s;
  -ms-transition: opacity 1s;
  -o-transition: opacity 1s;
  transition: opacity 1s;
}

将改变不同步骤的不透明度

总之，你可以找到元素，然后选择你想要的元素并制作一个.css 和 jquery，例如：

$("body").find(".future")[0].css("opacity","1.0"); <-- This will change just the first future step found

无论如何，请阅读 css 规则和特殊性： https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity

希望对您有所帮助

编辑

虽然你可能还想使用 :firs-child 或 :after（CSS 选择器）也可以帮助你：http://quirksmode.org/css/selectors/firstchild.html http://www.w3schools.com/cssref/sel_after.asp

不活动时不要使幻灯片内容变暗

Don't dim slide content when not active

javascript

css

impress.js