Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...

Search the Community

Showing results for tags 'parallax'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • GreenSock Forums
    • GSAP
    • Banner Animation
    • Jobs & Freelance
  • Flash / ActionScript Archive
    • GSAP (Flash)
    • Loading (Flash)
    • TransformManager (Flash)

Product Groups

  • Club GreenSock
  • TransformManager
  • Supercharge

Categories

There are no results to display.


Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


Personal Website


Twitter


CodePen


Company Website


Location


Interests

  1. Hello, I am working with a banner that is 970x418. I am trying to create a parallax effect on y-scroll (drag). In order to do this, I assume that: 1) I need to create a "container div" with a "foreground div" and "background div," foreground on top of the background. 2) Set the container itself to scroll/drag and affect both div's together. 3) Change the speed the background div to be a little slower, in order to give the parallax illusion. So far, I haven't found anything that shows me how to work with dragging one item and using the info of that item to affect the positioning of a
  2. Hi, Since helping Stefdv in this topic i dug a little more into parallax and scroll controlled Tweens/Timelines, and i dedicated some time to create a tutorial and some code in order to help GSAP JS users to create some apps and web sites using this technique. Is not a lights-out-blow-your-mind type of tutorial, but i just was hoping to help some other users who might want to apply this into their creations. Here you can find the tutorial, as well as the source code and a couple of examples, since i don't have a blog of my own, i'll take the liberty to point comments here, unless the staff s
  3. Hi, I'm currently working on an iOS app using Flash CC and Adobe AIR and have been loving using greensock to create great tweens.. I have a shocking green membership which is great! Anyway, the majority of the app will be using illustrations. I have split these into three layers each (background, foreground & middle) and want to use the iPad gyroscope to move these separate movieclips around the stage to give a parallax 3d effect. Is it possible to do this using the greensock code with easing enabled? Or how complicated is it? Thanks, Adam
  4. I'm developing a slider with parallax effect, using TimelineMax. And it's joy ride with GSAP ! But, my intention was to deploy using node-webkit, and I'm getting quite inconsistent performance results. In the codepen I show just the basics, next and previous buttons and you should be able to swipe left and right. (Have to add much more, later, more content on each slide, probably dragging (with Draggable) and make it an infinite slider thing...) As for now, sometimes it just works beautifully, others, it's just a bit jerky, mostly at animations end, when slowing down. I've trie
  5. I was playing with paralax scrolling and found an old forum post about it following the mouse. The movement works well but I want to replace the pageX with the posistion of the div#viewPort offset. I tried a few things to get it and return it as a var but I couldn't get the doParallax function to read it. Any help is greatly appreciated.
  6. Hey guys, so basicly i want to trigger an animation when the visitor scrolls down to the place the animation is located. how would i go about doing it? this is the code i want to trigger: <script> //we'll use a window.onload for simplicity, but typically it is best to use either jQuery's $(document).ready() or $(window).load() or cross-browser event listeners so that you're not limited to one. window.onload = function() { var sponsor = document.getElementById("sponsor"), funktioner = document.getElementById("funktioner"), patenter = document.getElementById("pa
  7. Hi I am working on a website for a client which is basically an old flash site which I am translating into HTML with GSAP animation. The whole thing also uses parallax.js to create a layered 3d effect. This works great across all devices and moves when an ipad is tilted etc. My problem is that tweenmax is clashing somehow with the parallax javascript and causing the animations to jump or in the case of CSS opacity the fade does not work at all. When I remove parallax.js then it works just fine. So I did some research and then it occurred to me that it may be possible to create the para
  8. So I found a tutorial here: http://code.tutsplus.com/tutorials/a-simple-parallax-scrolling-technique--net-27641 That makes parallax scrolling very simple and easy to understand. I want to take the javascript from the tutorial and apply GSAP. Not sure how to do that however.. The JavaScript from the tutorial. I'm sure it's easy but it would probably take me hours of playing with it where someone here has probably done it already or could do it in a minute or two. var $window = $(window); $('section[data-type=background]').each(function(){ var $bgobj = $(this); // assigning the o
  9. I am currently building a website that utilizes gsap js and scrollmagic to create a parallax effect. It works perfectly in most browsers and I even got it to be responsive. However I noticed an issue with Safari 6 on Mac OSX where the animation still 'technically' works but is extremely glitchy. You can see what I mean here: http://adm-rhino.unl.edu:82/why-college/ Any ideas on a solution or where the problem stems from would be a great help.
  10. Hi all, I have created an infinite scrolling background with 4 layers. For giving the wrapping effect on each layer, I am using 2 copies of the same image and during the loop i am shifting the x positions. Now i want to use BlitMask for this, and i have sccuessfully implemented it too. I just want to have one doubt cleared : - there are 4 sprites for each layer updating in an update loop - these 4 layers are a child of BGScreen sprite should I use the BlitMask for just the BGScreen sprite or should I create 4 instances for each layer so that i can use the wrapping feature and the
  11. Hello greensockers, This is a "how's that done?" post rather than a plea for help solving something. I'm curious if anyone has any experience achieving a parallax effect on elements in a page. An impressive example - and incredible site overall, can be seen on the welcome page here: http://axel-aubert.fr/#accueil Most of my queries with Uncle Google have come up with solutions similar to Scrollorama, which is different. I did find Plax (http://cameronmcefee.com/plax/) but the demo isn't very smooth... wasn't able to find much beyond that. I realize this isn't completely related
  12. phsims

    Noobie needs help!

    Hi all, I am currently working on a onepage parallax wordpress site for a client, he spotted a site that had a load of cool effects and wants them adding to his site. That led me to superscrollorama which led me here. I am trying to recreate some of the effects from the superscrollarama demo site on the the clients site. I want to be able to use the same effect on numerous classes and have them trigger when they scroll into view and reverse when scrolling out of view (as they do on the demo site). Unfortunately ALL of them trigger at the same time (when the first class comes into vi
×