Hello Karl,
I have the possibility to let the page intro a text invite. I would like to run a video intro. Is there the possibility to display a text over the video?
Sorry for my bad English.
X3 Photo Gallery Support Forums
.overlay-text {
position: absolute;
top: 0;
z-index: 33;
color: #FFFFFF;
width: 100%;
height: 100vh;
display: flex;
align-items: center;
justify-content: center;
font-size: 2em;
pointer-events: none;
}
.overlay-text * {
pointer-events: auto;
}
function x3_load_page(){
var body = $('body'),
stale_overlay = body.children('.overlay-text'),
overlay = body.find('.content .overlay-text');
if(stale_overlay.length) stale_overlay.remove();
if(overlay.length) overlay.appendTo(body);
}
<div class="overlay-text">
Blah Blah blah <strong>more bold text!</strong>
</div>
Sorry, your question is not clear. You want an intro without photo or video? The only point of that would then be to use a gradient or background color, which is possible with the image intro plugin. Examples:npn wrote:Could you tell us if it is possible to use Page Intro plugin without photo above video intro only to use title description and content of page intro? The suggestion made above generates some errors in mobile versions and using scroll.
Hi~ karl~~~mjau-mjau wrote: 안녕하세요. "예"라고 대답하고 싶었지만 안타깝게도 이에 대한 X3 기능이 없으며 수정 사항을 살펴보면 예상보다 복잡했습니다. 향후 릴리스를 위해 이것에 대해 살펴 보겠지만 그 동안에는 아래의 javascript 및 CSS 수정으로 수행해야합니다 ... html 및 CSS에 어느 정도 익숙한 경우에만 진행하겠습니다.
패널> 설정으로 이동 > custom > custom CSS: Custom Javascript: 이제 다음과 같아야 합니다. 그런 다음 PAGE > 텍스트를 추가하려는 콘텐츠에서 "overlay-text"를 사용하여 div 요소 내부에 추가합니다. 텍스트가 비디오와 중앙에 오버레이됩니다. -맞추다. 오버레이 텍스트 요소 내에서 HTML을 사용할 수 있습니다.Code.overlay-text { position: absolute; top: 0; z-index: 33; color: #FFFFFF; width: 100%; height: 100vh; display: flex; align-items: center; justify-content: center; font-size: 2em; pointer-events: none; } .overlay-text * { pointer-events: auto; }
Codefunction x3_load_page(){ var body = $('body'), stale_overlay = body.children('.overlay-text'), overlay = body.find('.content .overlay-text'); if(stale_overlay.length) stale_overlay.remove(); if(overlay.length) overlay.appendTo(body); }
Code<div class="overlay-text"> Blah Blah blah <strong>more bold text!</strong> </div>
Do you have a link? That code was provided 5 years ago ...TristanJo wrote:Is it a z-index problem?
http://3.34.138.237/mjau-mjau wrote:Do you have a link? That code was provided 5 years ago ...TristanJo wrote:Is it a z-index problem?
It seems to be working, no?TristanJo wrote:plz~ karl~~~~~🥰
"Overlay text" is on top of the menu.:rofl:mjau-mjau wrote:It seems to be working, no?TristanJo wrote:plz~ karl~~~~~🥰
z-index: 3;
function x3_load_page(){
var overlay = document.getElementsByClassName('overlay-text')[0];
if(!overlay) return;
document.getElementById('content').append(overlay);
}