App für Präsentation-Erstellung

Infos Help

Text- Eingabe

HTML- Rahmen

STYLE Template

SCRIPT Template

Bitte einfachen Text eingeben, etwa nach diesen folgenden Wiederholungsmuster

Kurzer Titel-Text 
  ( dann mindestens 2 Leerzeilen )
Texte der zugehörigen Präsentations 
  ( dann mindestens 2 Leerzeilen )
usw.

Präsentation:

Vorschau ↧ Markiere ↧ w3.org Validator ➹

HTML-Rahmen:

Markiere ↧ w3.org HTML-Validator ➹

Style-Quelltext:

Markiere ↧ w3.org CSS-Validator ➹

body { margin:0; text-align:left; font-size:1.5rem;  
/*  background-image:linear-gradient(to right,transparent,#48c); */
background-image:url(./img/hintergrund_stuck1.jpg); 
background-position: center top;
background-size: 300% auto; 
}
h1 { display:block; text-align:left; margin:1rem 3rem 3rem 3rem;padding:0 1rem 0 3rem;
color:#fff;    background-image: linear-gradient(to top left, #fff 0%, #00a3ef 100%); 
}
h1 > span.name { float:right;font-size:1rem;  }
     
dl { clear:both; text-align:center; margin:3rem; }
dl > dt {
display:inline-block; float:left; width:3rem; position:relative;top:0;left:0rem;
margin:0; padding:0.3rem; background-color:inherit; color:#fff;
background-image: linear-gradient(to top left, #fff 0%, #00a3ef 100%);
}
dl > dt.dt_passiv {background-color:inherit; color:#999;border:0.1rem solid #aaf;}
dl > dt.dt_aktiv {background-color:inherit; color:#004;border:0.1rem solid #f00;}

dl > dd { clear:both; display:block; height:25rem; margin:1rem; text-align:left; position:relative;top:0;left:0rem; 
margin:2rem 0 0 0; padding:1rem; 
color:#fff;background-color:#050008; opacity:0.9;
background-image: linear-gradient(to right, #059 0%,  #aaa 100%);
}

SCRIPT-Quelltext:

Markiere ↧ jsLint ➹

var praesentation = (function (doc) { "use strict"; 
var win = doc.defaultView; // var doc = window.document;

function is_online() {var p = win.location.protocol;
return ((/(http|https)\:/).test(p)) && (!(/file\:/).test(p));
}
function get_dom_nodes(selektoren_str, parent_ele) {
var parent = parent_ele || doc;
return parent.querySelectorAll(selektoren_str);
}
function dt_handler(k) {
return function (event) { event.preventDefault(); event.stopPropagation();
var i, dt, dd,
dts = get_dom_nodes("dl > dt"),
dds = get_dom_nodes("dl > dd"),
len = Math.min(dts.length, dds.length);

for (i = 0; i < len; i += 1) {
dt=dts[i]; dd=dts[i];
dt.classList.remove("dt_aktiv");
dt.classList.add("dt_passiv");
dd.style.display = "none";
}
dt=dts[k]; dd=dds[k];
dt.classList.remove("dt_passiv");
dt.classList.add("dt_aktiv");
dd.style.display = "block";
};
}

window.onload = function () {"use strict";
praesentation.init();
};