Jump to content
GreenSock

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

Search the Community

Showing results for tags 'jquery'.

  • 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. As you can see in the attached codepen, I want to make a small hover effect. after looking through some docs on both Jquery and GSAP, it still is not working. Is there something I'm doing wrong?
  2. Hi to all in this forum, Sorry for writing so much text, but being a newbee with GSAP, I decided to describe all my steps in order other users could find at which step I was wrong. Thanks. I. Prehistory: Recently I happily grabbed some nice code from Crysto's website and Petr's blog for my text animation purposes (wow, wrapping each element into <span> with jQuery and passing it to TweenMax is just magic !!!) After diving into code dependencies, I understood (hopefully) that <div> with animated text should have css markup (id) like #gsap-anim-text-1 with position:relative a
  3. I have a horizontal gallery that is positioned centered on the page. I have a left and right button which slide the gallery left and right using TweenMax timeline on mouse hover. The right button is hidden on page load and I want to show the right button once the gallery reaches a certain offset position. If I use Jquery scroll I can detect the changing offset position of the gallery but if the user hovers on the button I can't get the changing offset position of the gallery while the gallery is tweening. How can I get the moving offset position of the gallery during mouse hover?
  4. Hi all. Complete newbie to GSAP here. i'm looking forward to getting to grips with it to add some animation to a site I'm currently redesigning. At the minute though there's one legacy script on the site, which relies on jQuery. It's just a wee utility script which will animate scrolling to any element on a page with an ID attribute set. [see the Codepen] I want to "translate" this to GSAP instead, as it seems daft loading jQuery as well as GSAP, just for this one feature. However my JavaScript Fu is a bit rusty and I'm not having much luck working out how to GSAP-ise my selector.
  5. I am working on a parallax page, but i have problems moving my elements while scrolling without the choppy behavior. Something tells me that the combination of top/bottom and translate is the root cause, but i am not sure how i solve my task without top/bottom? I am trying to create a behavior where all the elements are almost on top of each other when i have almost reached #section2. How can i avoid this choppy behavior? Its very important that the elements are placed as they are, but i think my usage of top and xPercent is causing performance issues
  6. Hi First of all, I'm a total JS noob so apologies if this is a really simple question. I'm trying to animate burning embers, based on this confetti codepen: http://codepen.io/MAW/pen/wBGvgW But it's reliant on jQuery - I need a jQuery-less solution, using only TweenMax, is this possible? Trying to change the code myself (http://codepen.io/htwinam/pen/EPOryg) just throws up endless errors and doesn't work so would be massively grateful for any help Thanks
  7. I'm trying to recreate the function Scroll (Drag & FLick) from GreenSock (https://greensock.com/draggable ) on my website to make an image navigation throught a small city. It works great grabbing the image but my problem now is make the arrow navigation work as well as if I'm grabbing the image around. I'm a pretty newbie at the .js and read the documentation but couldn't make this work at all. Someone could take a look and maybe give me some lights on it? Thanks a lot
  8. Hi there I'm working through some of the concepts of GreenSock and was hoping someone could point out to me the issue with this animation. As you can see in the codepen the slider measuring the duration of the entire timeline is only about 80% through when it appears all my animations are finished. As a result, when I got to reverse the animation, there is a considerable delay before an animation kicks in. Thanks DB
  9. Hi, I'm fairly new to GSAP, but I'm really enjoying experimenting with it. A hurdle I have come up against is how to hover over a specific div, and have an animation play based on which div is hovered over. I do not want to have to write the animation for each div. I know the way to do this is to use the jQuery selector 'this', but I can't get it to work for a timeline. I can get it to work using TweenMax.to('') etc, but I want to be able to use play() and reverse(), and so need it to work with a timeline. Rather than me babbling on, it's probably best to just check the codep
  10. Hey All, Simple question I hope can be answered. At the moment when .card is clicked all the divs with the class .card animate. I only want to animate the .card div that is clicked. I've experimented heaps with $(this) selection and I can't get it to work as intended. Any help is much appreciated. Thanks all.
  11. Hi, I'm developing a HTML app that needs to work exceptionally fast, particularly on mobile. So I've decided to sidestep using Jquery. I've been looking at http://youmightnotneedjquery.com/ as reference, and while I would not use Jquery for animation, I wondered if using bits of it's functionality would slow it down at all? eg: $(myElement).offset(); is very handy Would that undo all the performance-enhancing work on avoiding jquery code, or is using a combination of GreenSock/Jquery a good approach? From Google: Thanks
  12. Please, could You explain me why the rotationX params doesn't fit like rotationY & rotationZ in my 3D cube test?
  13. I need some help with animating certain parts of my svg image when clicked on another part of the svg image. This is what I'm trying to do: When you click on one of the smaller buttons, for example the yellowbutton, the yellowblock will appear (with opacity: 1) and the other coloured blocks will dissapear (with opacity: 0). When you click on the orangebutton, the orangebutton will appear and the other coloured blocks will dissapear etc. etc. I think I'm on the right track but something isn't working.
  14. Hello, I'm trying to implement the morphing plugin on an accordion module to morph the "+" to a "-" when the answer is in an open state when clicked and back again on the second click or if another trigger is clicked. But when any of the trigger elements is clicked all of the svgs morph. I would appreciate any help you could offer. Thanks, Tim
  15. Can someone please help me fix this code that I found, I would like to use it in my assignment: the problem: on zoom in (ctrl+) and zoom out (ctrl-) the carousel goes crazy the code can be found at this address http://codepen.io/anon/pen/KdxJbP Any assistance would be greatly appreciated PS post responses here
  16. Hey all! I'm trying to animate some pagination elements we have on a company site redesign and am running into some scoping issues (I think). I will start by saying my JS-fu is not great so it's highly possible this isn't so much a GSAP problem as it is a jQuery problem. You can see the core HTML / SCSS here - http://codepen.io/geebru/pen/avRbzw/ And the JS I'm attempting here: // Pagination // Get pagination items function pagerAnimate(play) { console.log("pagerAnimate Activated"); var $this = $(this); var pagerIcon = $this.find('.pagination__icon'); var p
  17. reference: http://codepen.io/Liamii/pen/RWxVYK Hello! i have jQuery loading in but i don't think i need it, its only used on one line. im happy to use the basic JS notation in its place. var sizes = ["small", "medium", "large"]; for (var i = 0; i < 750; i++) { var sizeIndex = randomNumber(0, 2); var size = sizes[sizeIndex]; var star = $('<div class="star ' + size + 'Star"/>').appendTo(sky); can anyone tell me what the replacement code would be? thanks
  18. Fascinating issue we are having which may force us to just get rid of lightbox. I can't really post a link to this issue because of all the code that's involved. It's a simple site though. No matter what I do, no matter what I try...lightbox, fancybox, jquery dialog simply do not work. Is there something I should know?
  19. Hi, This codepen works in IE but not Chrome or Firefox. Basically its the same setup as i have in Lectora. Lectora autogenerates html and css, so i cannot change much in the structure of the html. The javascript however i can change to whatever needed to get this working. Doublechecked with some other projects done, and noticed that indeed IE works while Firefox and Chrome have problems with tweens for x/y, rotation, scale and the alike... Tested on: Windows 10, IE: 11.0.10240 FF: 41.0.1 Chrome: 45.0.2454.101 m Doing some searching in different codepens i find several
  20. Hello, I am re-writing some basic code I was working on and adding GSAP. (TweenMax) I used the TweenMax object (function? I'm new at this.) and then attempted to use jquery's .queue to set up a JQuery function on completion. It doesn't work, but I don't know why, and I don't know what my alternatives are. Thank you for your time!
  21. sym.getComposition().getStage().getSymbol('mc1').getSymbol('element'). Above is the button code (btn) I have to reach the symbol 'element', nested in 'mc1' on the stage. For this example I want to tween 'element' with this code: TweenMax.to(element, 3, {alpha:0.5}); in the future I want to apply a timeline to it. (is this possible? Not quite sure) tl.to(element, 1, {width:"50%"}); My problem is that I can't quite point to it, or figure out how to do this... I have managed to work out how to add external images, video, iFrames and apply text to nested symbols via buttons but th
  22. I have a click event bound to a "open menu" element and a another one bound to a "close menu" element. After page load, both elements execute as expected but the click event isn't fired if you try to open the menu again. It seems like such a simple piece of code. What am I missing here?
  23. Hi all, I'm in the process of making a headline page with typewriter-ey effects and large epilepsy-inducing text replacement. I've managed to use the TextPlugin to great effect for my primary headline (turned off for the purpose of this question in the blockLetters timeline). What i'm struggling to do is combine both the TextPlugin and SplitText to effect as you can see in the timeline that's active (albumLetters). Ideally i'd want the div to be empty on load then I can control the entire thing through GSAP but it doesn't seem to want to change the copy in the fullText div after SplitT
  24. I'm a seasoned flash developer who's done a lot of flash banner. Have been asked to look into doing an HTML5 banner, and since I know a fair amount of Javascript, some jQuery, GSAP, etc, I think I can do it. This is a concept banner, the ad agency doesn't really know what they're doing, so I don't know if what they want is possible. I also must admit, I don't see the forest for the trees as far as creating HTML5 banners, never having done it, so any help on how to best-practice it would be helpful. Specs are: "One 300x250 unit, does not expand, HTML5, 40k initial load (we can do 50k if
  25. Actually I am making a web app which part of it contains a touch swipe action in order to browse between different parts of a section in mobile devices of course, the elements which move after the user swipes will be dynamically added or removed; I have made a static version of this so far but I need to make sure it is capable of being dynamic, I have used hammer js for controlling swipe action and tweenmax js for handling the animation. My problem is that I do not know how to recognize which .chanel element is in sight so I can figure out which is the next one and which is the previous on
×