소스 검색

content now re-renders after alt+click zoom (closes #195)

Hakim El Hattab 12 년 전
부모
커밋
e87d689231
3개의 변경된 파일42개의 추가작업 그리고 3개의 파일을 삭제
  1. 32 0
      css/reveal.css
  2. 3 3
      index.html
  3. 7 0
      plugin/zoom-js/zoom.js

+ 32 - 0
css/reveal.css

@@ -1150,3 +1150,35 @@ body {
 }
 
 
+/*********************************************
+ * ZOOM PLUGIN
+ *********************************************/
+
+.zoomed .reveal *,
+.zoomed .reveal *:before,
+.zoomed .reveal *:after {
+	-webkit-transform: initial !important;
+	   -moz-transform: initial !important;
+	    -ms-transform: initial !important;
+	        transform: initial !important;
+
+	-webkit-backface-visibility: initial !important;
+	   -moz-backface-visibility: initial !important;
+	    -ms-backface-visibility: initial !important;
+	        backface-visibility: initial !important;
+}
+
+.zoomed .reveal .progress,
+.zoomed .reveal .controls {
+	opacity: 0;
+}
+
+.zoomed .reveal .roll span {
+	background: none;
+}
+
+.zoomed .reveal .roll span:after {
+	visibility: hidden;
+}
+
+

+ 3 - 3
index.html

@@ -38,6 +38,9 @@
 				<section>
 					<h1>Reveal.js</h1>
 					<h3>HTML Presentations Made Easy</h3>
+					<p>
+						<small>Created by <a href="http://hakim.se">Hakim El Hattab</a> / <a href="http://twitter.com/hakimel">@hakimel</a></small>
+					</p>
 				</section>
 
 				<section>
@@ -46,9 +49,6 @@
 						reveal.js is a framework for easily creating beautiful presentations using HTML. You'll need a browser with
 						support for CSS 3D transforms to see it in its full glory.
 					</p>
-					<p>
-						<i><small>- <a href="http://hakim.se">Hakim El Hattab</a> / <a href="http://twitter.com/hakimel">@hakimel</a></small></i>
-					</p>
 
 					<aside class="notes">
 						Oh hey, these are some notes. They'll be hidden in your presentation, but you can see them if you open the speaker notes window (hit 's' on your keyboard).

+ 7 - 0
plugin/zoom-js/zoom.js

@@ -111,6 +111,13 @@ var zoom = (function(){
 		}
 
 		level = scale;
+
+		if( level !== 1 && document.documentElement.classList ) {
+			document.documentElement.classList.add( 'zoomed' );
+		}
+		else {
+			document.documentElement.classList.remove( 'zoomed' );
+		}
 	}
 
 	/**