Merge branch 'open-source-site' of https://github.com/mobify/mobifyjs …

…into open-source-site
mobify · Aug 1, 2012 · f348bc5 · f348bc5
2 parents 055ed01 + 203df6f
commit f348bc5
Show file tree

Hide file tree

Showing 9 changed files with 443 additions and 444 deletions.
diff --git a/modules/carousel/carousel-controls.css b/modules/carousel/carousel-controls.css
@@ -1,9 +1,12 @@
 /* 
   Carousel control base styling 
 */
+
 .m-carousel-controls {
   padding-top: 10px;
+  text-align: center;
 }
+
 .m-carousel-controls a {
     padding: 5px;
     -webkit-user-select: none;
@@ -159,4 +162,35 @@
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box;
+}
+
+
+
+/* scaled slides */
+.m-scaled .m-item {
+  opacity: 0.7;
+  -webkit-backface-visibility: hidden;
+  -webkit-transform: scale(0.75);
+  -moz-transform: scale(0.75);
+  -ms-transform: scale(0.75);
+  -o-transform: scale(0.75);
+  transform: scale(0.75);
+
+  /* Configure animations */
+  /* (0.5s would match the transition length between each, 
+      but fast swiping on a phone can result in odd timing. 
+      Half-length durations for each transform is a reasonable 
+      middle ground.) */
+  -webkit-transition: -webkit-transform cubic-bezier(0.33, 0.66, 0.66, 1) 0.25s, opacity ease-out 0.25s;
+  -moz-transition-timing-function: -moz-transform cubic-bezier(0.33, 0.66, 0.66, 1) 0.25s, opacity ease-out 0.25s;
+  -o-transition-timing-function: -o-transform cubic-bezier(0.33, 0.66, 0.66, 1) 0.25s, opacity ease-out 0.25s;
+  transition-timing-function: transform cubic-bezier(0.33, 0.66, 0.66, 1) 0.25s, opacity ease-out 0.25s;
+}
+.m-scaled .m-active {
+  opacity: 1;
+  -webkit-transform: scale(1);
+  -moz-transform: scale(1);
+  -ms-transform: scale(1);
+  -o-transform: scale(1);
+  transform: scale(1);
 }
diff --git a/modules/carousel/carousel.js b/modules/carousel/carousel.js
@@ -333,20 +333,17 @@ Mobify.UI.Carousel = (function($, Utils) {
             .on('click.carousel', click)
             .on('mouseout.carousel', end);
 
-        $element.find('[data-slide]').each(function(){
-            var $this = $(this);
+        $element.on('click', '[data-slide]', function(e){
+            e.preventDefault();
+            var action = $(this).attr('data-slide')
+              , index = parseInt(action, 10);
 
-            $this.click(function(){
-                var action = $this.attr('data-slide')
-                  , index = parseInt(action, 10);
-
-                if (isNaN(index)) {
-                    self[action]();
-                } else {
-                    self.move(index);
-                }
-            });
-        })
+            if (isNaN(index)) {
+                self[action]();
+            } else {
+                self.move(index);
+            }
+        });
 
         $element.on('afterSlide', function(e, previousSlide, nextSlide) {
             self.$items.eq(previousSlide - 1).removeClass(self._getClass('active'));

diff --git a/www/_includes/nav-modules.html b/www/_includes/nav-modules.html
@@ -8,7 +8,6 @@
 		                        <ul class="hide-inactive">
 			                        <li><a href="{{ site.baseurl }}/modules/carousel-examples/">Examples</a></li>
 			                        <li><a href="{{ site.baseurl }}/modules/carousel/#usage">Usage</a></li>
-			                        <li><a href="{{ site.baseurl }}/modules/carousel/#markup">Markup</a></li>
 			                        <li><a href="{{ site.baseurl }}/modules/carousel/#classes">Classes</a></li>
 			                        <li><a href="{{ site.baseurl }}/modules/carousel/#methods">Methods</a></li>
 			                        <li><a href="{{ site.baseurl }}/modules/carousel/#events">Events</a></li>

diff --git a/www/_layouts/module-index.html b/www/_layouts/module-index.html
@@ -12,7 +12,7 @@
 		<li class="carousel">
 			<a href="{{ site.baseurl }}/modules/carousel">
 				<h3>Carousel</h3>
-				<p>A configurable rotating content carousel module.</p>
+				<p>A configurable rotating content carousel.</p>
 			</a>
 		</li>
 		<li class="accordion">
@@ -27,6 +27,8 @@ <h3>Zoomable</h3>
 				<p>{description needed}</p>
 			</a>
 		</li>
+        <!-- 
+
 		<li class="coming-soon">
 			<a href="{{ site.baseurl }}/modules/">
 				<h3>Coming Soon</h3>
@@ -45,7 +47,7 @@ <h3>Coming Soon</h3>
 				<p>We&#8217;re hard at work on more modules. Watch this space.</p>
 			</a>
 		</li>
-	</ul>
-
-</div>
 
+        -->
+	</ul>
+</div>