Skip to content
Browse files

Added links to ScrollMagic

  • Loading branch information...
1 parent 3ecd5aa commit 34dedab7c577b91b0c5ded6631706b13bb4501d4 @janpaepke janpaepke committed Feb 28, 2014
Showing with 49 additions and 0 deletions.
  1. +8 −0 README.md
  2. +30 −0 css/style.css
  3. +11 −0 index.html
View
8 README.md
@@ -4,6 +4,14 @@ The jQuery plugin for doing supercool scroll animation.
Check out the [Project Page](http://johnpolacek.github.com/superscrollorama) for more information.
+## IMPORTANT:
+### Superscrollorama as been superceeded by ScrollMagic
+Check out ScrollMagic [here](http://janpaepke.github.io/ScrollMagic/) or visit it on GitHub: http://janpaepke.github.io/ScrollMagic
+There will be __no future versions__ of Superscrollorama and support will also focus on ScrollMagic.
+So if you're starting a new project we strongly recommend to use ScrollMagic instead.
+
+## Contact
+
[Follow me on Twitter](http://twitter.com/johnpolacek)
Need help building your website? [Contact us](http://johnpolacek.com/contact/)
View
30 css/style.css
@@ -273,4 +273,34 @@ blockquote {
}
.mobile-demo h3 {
color:#C5C3DE;
+}
+
+#newversion {
+ position: absolute;
+ top: 230px;
+ left: 50%;
+ margin-left: 250px;
+ z-index: 100;
+ background-color: #D92B00;
+ width: 200px;
+ height: 200px;
+ border-radius: 100px;
+ box-shadow: 0 2px 1px #000;
+}
+#newversion h2 {
+ font-size: 43px;
+ margin: 0;
+ padding: 30px 0px 0px 0px;
+ color: #FFFFFF;
+ font-style: normal;
+}
+#newversion a {
+ text-decoration: none;
+ padding: 0px 20px 20px 20px;
+ display: block;
+ font-size: 18px;
+ color: #FFFFFF;
+}
+#newversion a:hover span {
+ text-decoration: underline;
}
View
11 index.html
@@ -14,6 +14,13 @@
<a href="https://github.com/johnpolacek/superscrollorama">
<img style="position: absolute; top: 0; right: 0; border: 0; z-index: 999999999;" src="https://s3.amazonaws.com/github/ribbons/forkme_right_red_aa0000.png" alt="Fork me on GitHub" alt="Fork me on GitHub" />
</a>
+
+ <div id="newversion">
+ <a href="http://janpaepke.github.io/ScrollMagic/">
+ <h2>New Version</h2>
+ <span>Click here to find out more!</span>
+ </a>
+ </div>
<div id="intro">
<h1 id="title">
@@ -381,6 +388,9 @@ <h2 id="bring-it">Bring It</h2>
<script src="js/jquery.superscrollorama.js"></script>
<script>
$(document).ready(function() {
+ // set rotation of flash
+ TweenMax.set("#newversion", {rotation: 15});
+
$('body').css('visibility','visible');
// hide content until after title animation
@@ -402,6 +412,7 @@ <h2 id="bring-it">Bring It</h2>
TweenMax.from( $('#title-line3 .char4'), .25+Math.random(), {css:{top: '-200px', left:'1000px'}, ease:Elastic.easeOut}),
TweenMax.from( $('#title-line3 .char5'), .25+Math.random(), {css:{top: '200px', left:'1000px'}, ease:Elastic.easeOut})
])
+ .from("#newversion", .4, {scale: 5, autoAlpha: 0, ease: Elastic.easeOut})
.to( $('#title-info'), .5, {css:{opacity:.99, 'margin-top':0}, delay:-1, ease:Quad.easeOut});
function initScrollAnimations() {

0 comments on commit 34dedab

Please sign in to comment.
Something went wrong with that request. Please try again.