janishutz-legacy/impress.js
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

impressive markup clean-up - wrapper elements now automagically generate themselves

Browse Source
This commit is contained in:
Bartek Szopka
2011-12-30 14:01:16 +01:00
parent 118f92e33c
commit 3a67355863
2 changed files with 15 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
index.html
View File

@@ -13,7 +13,7 @@
</head>
<body>
<div id="impress"><div class="canvas">
<div id="impress">
<div id="bored" class="step slide" data-x="-1000" data-y="-1000">
<q>Aren't you just <b>bored</b> with all those slides-based presentations?</q>
@@ -39,7 +39,7 @@
and based on the <strong>power of CSS3 transforms and transitions</strong> in modern browsers.</p>
</div>
</div></div><!-- #impress .canvas -->
</div>
<script src="js/impress.js"></script>

15
js/impress.js
View File

@@ -29,6 +29,10 @@
})();
var arrayify = function ( a ) {
return [].slice.call( a );
};
var css = function ( el, props ) {
var key, pkey;
for ( key in props ) {
@@ -49,7 +53,7 @@
var $$ = function ( selector, context ) {
context = context || document;
return [].slice.call( context.querySelectorAll(selector) );
return arrayify( context.querySelectorAll(selector) );
};
var translate = function ( t ) {
@@ -71,7 +75,14 @@
// DOM ELEMENTS
var impress = document.getElementById("impress");
var canvas = $(".canvas", impress);
var canvas = document.createElement("div");
canvas.className = "canvas";
arrayify( impress.childNodes ).forEach(function ( el ) {
canvas.appendChild( el );
});
impress.appendChild(canvas);
var steps = $$(".step", impress);