Slideshow for Opera. Not maintained anymore.

opShowHelper.css

@charset "UTF-8";

@media screen{
	body:not(.alwaysVisible) > *:not(.avant){
		display: none;
	}
}

@media projection, print{
	body{
		margin: 0;
	}
	section, div.pseudo-section{
		display: block;
		box-sizing: border-box;
		overflow: hidden;
		page-break-after: always;
	}

	.avant{
		display: none;
	}
}

@media projection{
	.opShowAnimation{
		visibility: hidden;
	}
	.opShowAnimated{
		visibility: visible;
	}
}

opShowHelper.js

(function(){
	"use strict";

	document.getElementsByClassName = function(className){
		var all = document.getElementsByTagName("*"), ret = [], regex = new RegExp("\\b" + className + "\\b"), i;
		for(i = 0; i < all.length; i += 1) if(all[i].className.match(regex)) ret[ret.length] = all[i];
		return ret;
	};

	(function(){
		var ss = document.styleSheets[0];
		ss.insertRule("@media projection, print{ section, div.pseudo-section{ height: " + screen.height + "px; } }", ss.cssRules.length);
	})();

	addEventListener("keydown", function(event){
		var target, i,
		animate = function(target){
			if(target.className.match(/\bopsa-fadein\b/)){
				(function(target){
					var doAnimation = function(target, value){ target.style.opacity = value; },
					goal = parseFloat(target.currentStyle.opacity),
					i;

					target.style.opacity = 0;
					for(i = 0; i <= 50; i += 1) setTimeout(doAnimation, i * 20, target, i * goal * 0.02);
				})(target);
			}

			if(target.className.match(/\bopsa-slidein-left\b/)){
				(function(target){
					var doAnimation = function(target, step){ target.style.marginLeft = parseFloat(target.style.marginLeft) + step + "px"; },
					goal = parseFloat(target.currentStyle.marginLeft),
					p = target.parentNode,
					initDisplay = target.currentStyle.display,
					initWidth = target.currentStyle.width,
					step = 20,
					s, i;

					target.style.display = "inline-block";
					target.style.width = target.clientWidth + "px";
					target.style.display = initDisplay;

					while(p.tagName.toLowerCase() !== "section") p = p.parentNode;

					s = -(target.offsetLeft + target.offsetWidth);

					target.style.marginLeft = String(s) + "px";
					for(i = 0; i < Math.floor((goal - s) / step); i += 1) setTimeout(doAnimation, i * 20, target, step);
					setTimeout(function(target, goal, initWidth){
						target.style.marginLeft = goal;
						target.style.width = initWidth;
					}, i * 20, target, goal, initWidth);
				})(target);
			}
		};

		if(event.shiftKey || event.altKey || event.ctrlKey) return;

		switch(event.keyCode){
			case 78:
				target = document.getElementsByClassName("opShowAnimation");
				if(target.length < 1) break;
				target = target[0];
				target.className = target.className.replace(/\bopShowAnimation\b/, "opShowAnimated");
				animate(target);

				break;
			case 66:
				target = document.getElementsByClassName("opShowAnimated");
				if(target.length < 1) break;
				target = target[(target.length - 1)];
				target.className = target.className.replace(/\bopShowAnimated\b/, "opShowAnimation");
				break;
		}
	}, false);

	addEventListener("load", function(){
		var newss;
		document.getElementsByTagName("head")[0].appendChild(document.createElement("style"));
		newss = document.styleSheets[document.styleSheets.length - 1];

		(function(newss){
			var target = document.getElementsByClassName("vertically-centering"),
			idPrefix = "mdl_" + String(new Date().getTime() - (Math.floor(new Date().getTime() / 1000000000) * 1000000000)),
			p, l,
			i;

			for(i = 0; i < target.length; i += 1){
				if(target[i].id === "") target[i].id = "opShow-" + idPrefix + "_" + String(i);
				p = target[i].parentNode;
				l = p.offsetLeft + parseFloat(p.clientLeft);
				newss.insertRule("@media projection, print{\n" +
					"\t#" + target[i].id + "{ margin: 0; }\n" +
					"\t#" + target[i].id + " > *:nth-child(1){ margin-top: 0; }\n" +
					"\t#" + target[i].id + " > *:nth-last-child(1){ margin-bottom: 0; }\n" +
				"}", 2 * i);
				newss.insertRule("@media projection, print{\n" +
					"\t#" + target[i].id + "{\n" +
					"\t\tposition: absolute; top: " + String((screen.height - target[i].offsetHeight) / 2) + "px;\n" +
					"\t\tleft: 0px;\n" +
					"\t\tbox-sizing: border-box;\n" +
					"\t\twidth: 100%;\n" +
					"\t\tpadding-left: " + String(l + parseFloat(p.currentStyle.paddingLeft)) + "px;\n" +
					"\t\tpadding-right: " + String(screen.width - l - p.clientWidth + parseFloat(p.currentStyle.paddingRight)) + "px;\n" +
					"\t}\n" +
				"}", 2 * i + 1);
			}
		})(newss);
	}, false);
})();