Position: behoben in reveal.js

Ich versuche, eine Überschrift für meine replave.js Präsentation zu machen, die am oberen Rand des Bildschirms bleibt. Der Inhalt in der Kopfzeile ist auf einer Pro-Folie-Basis dynamisch, daher muss ich das Markup innerhalb des Abschnitts-Tags platzieren.Position: behoben in reveal.js

Scheinbar Position liefert nicht wirklich zufriedenstellende Ergebnisse in reveal.js, wenn das Markup innerhalb des Abschnittstags ist. Ich kann wirklich nicht verstehen, warum das genau ist, aber ich fand einige Informationen in den GitHub Repo was auf die Präsentation Größeneinstellung mit der Darstellungsgröße passen:

Reveal.initialize { 
    ... 
    width: '100%', 
    height: '100%', 
    ... 
}

Aber es ist für mich immer noch nicht funktioniert - Es scheint, dass die Präsentation nicht wirklich von den oben genannten beeinflusst wird. Hier ist eine Demo:

https://dl.dropboxusercontent.com/u/706446/_linked%20stuff/reveal.js/index.html

Irgendwelche Ideen wie diese zu lösen?

Quelle

2014-04-23 funkylaundry

Keine Ideen. Aber ich möchte das Gegenteil tun (platziere einen Block links unten) und bin genauso frustriert. – Amanda

Hier ist der Thread auf Github Ich habe erwähnt, aber ich war nicht einmal in der Lage, die Show den Viewport ausfüllen: https://github.com/hakimel/reveal.js/issues/857 Ich habe das noch nicht erreicht, aber Mein Plan ist, etwas Text auf die Folie zu legen und dann JavaScript zu verwenden, um es beim Laden aus der Folie zu entfernen. – funkylaundry

Am Ende Ihres main.html add:

Reveal.initialize({ center: false, })

Quelle

2014-10-16 14:58:52 btReel

Fügen Sie diese auf CSS:

.reveal.slide .slides > section, .reveal.slide .slides > section > section { 
    min-height: 100% !important; 
    display: flex !important; 
    flex-direction: column !important; 
    justify-content: center !important; 
    position: absolute !important; 
    top: 0 !important; 
    align-items: center !important; 
} 
section > h1, section > h2 { 
    position: absolute !important; 
    top: 0 !important; 
    margin-left: auto !important; 
    margin-right: auto !important; 
    left: 0 !important; 
    right: 0 !important; 
    text-align: center !important; 
} 
.print-pdf .reveal.slide .slides > section, .print-pdf .reveal.slide .slides > section > section { 
    min-height: 770px !important; 
    position: relative !important; 
}

Quelle

2016-01-21 11:36:12 rofrol

Position: behoben in reveal.js

Antwort

Verwandte Themen