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> </head>
<body> <body>
<div id="impress"><div class="canvas"> <div id="impress">
<div id="bored" class="step slide" data-x="-1000" data-y="-1000"> <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> <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> and based on the <strong>power of CSS3 transforms and transitions</strong> in modern browsers.</p>
</div> </div>
</div></div><!-- #impress .canvas --> </div>
<script src="js/impress.js"></script> <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 css = function ( el, props ) {
var key, pkey; var key, pkey;
for ( key in props ) { for ( key in props ) {
@@ -49,7 +53,7 @@
var $$ = function ( selector, context ) { var $$ = function ( selector, context ) {
context = context || document; context = context || document;
return [].slice.call( context.querySelectorAll(selector) ); return arrayify( context.querySelectorAll(selector) );
}; };
var translate = function ( t ) { var translate = function ( t ) {
@@ -71,7 +75,14 @@
// DOM ELEMENTS // DOM ELEMENTS
var impress = document.getElementById("impress"); 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); var steps = $$(".step", impress);