Jump to content

ektorp

ShockinglyGreen
  • Content Count

    13
  • Joined

  • Last visited

Community Reputation

9 Newbie

About ektorp

  • Rank
    Member
  1. ektorp

    Tween SVG <img> color

    This is what I thought. Thanks for the confirmation PointC...it's much appreciated.
  2. I have seen that pretty much all of the SVG animations involve embedding the XML directly into the page and using GSAP to manipulate the various properties and attributes. I am looking to see if it is possible to animate SVG by simply embedding it in an <img> tag. Here is a simple example I am looking to do to tween the SVG color on rollover but it doesn't seem to be taking it. These SVG elements are going to be implemented through a CMS so I was thinking that including them with an <img> tag would make much sense...but I wanted to see if there might be any limitations with this type of implementation.
  3. I have a header animation using SplitText. There are 2 main steps to this header animation. The header letters first animate 'y' into place and then when it is complete it does a wavy text animation effect. It is technically working but the transition from step 1 to step 2 is a bit rough and jerky. I've tried making small adjustments to the pixel values but nothing seems to be working quite well. Can anything be done to smoothen the experience?
  4. ektorp

    Wavy Text

    Perfect. Thanks so much OSUblake. Yeah, a part of me didn't believe a stagger was the best solution for this...I just wasn't sure of a better approach. Thanks again.
  5. ektorp

    Wavy Text

    Thank you ohem for your response. Yes, I see how playing with the timing and eases produces different effects but it is still not the result I am looking for. The whole timeline plays through each character one at a time and when the timeline ends the whole timeline and each character repeats itself. What I need is for each character to always be animating. Currently, regardless of the timing or ease setting, each character plays and then stops, and then doesn't start again until the whole timeline completes and restarts itself. For what I need, each character should never stop. They will be continuously animating vertically with each next character staggering in which should create a fluid wavy text animation. I hope this helps with explaining the effect I need. Thanks again ohem for your response.
  6. ektorp

    Wavy Text

    I am trying to create a wavy text effect using SplitText and Timeline staggers. Below is what I have so far but it isn't exactly giving me the result I need. You can see the whole thing does stagger a wavy text effect but I need the animation effect to be more fluid. Basically, every letter should be moving at all times and each next letter would would be slightly staggered to give a continuous looping wavy text effect. If it were just a column of divs it would be a bit more simple but the text is dynamic and I am trying to make use of SplitText and staggered timelines to get the results I need. Any help would be greatly appreciated. http://codepen.io/bdang/pen/YWAWOo/
  7. This is a recent duplicate issue as you can see below. Basically, setting the 'left' property requires setting it's 'position' property as well while using transforms such as 'x' do not require a 'position' setting. Rodrigo sums it up pretty well: http://greensock.com/forums/topic/12374-having-trouble-animating-a-jpg/
  8. you simply need to set the position attribute for your image. just change your img css to the following and you should be good: img { position: relative; display: block; width:200px; }
  9. I just created a similar slider below. It uses GSAP Draggable and performs quite well on all screens. I am now looking to make it loop infinitely as you swipe through the slides. I am not clear on how the infinite looping is done. Any help on getting this to work like this ExtraSlider would be much appreciated. http://codepen.io/bdang/pen/db82c6c86dfef17951df744ed8e3a42a
  10. With the help of Draggable, I've put together a swipe carousel gallery using test place holder assets. It's pretty straight forward and works the way a standard touch based carousel would work. Performance on mobile and tablets is great. I am now looking to implement an infinite or looping carousel that continuously rotates through the slide items as you swipe through. I know there are various jQuery plugins that do this but I am looking to do my own custom solution using GSAP. I've seen some examples doing this using div or slide "clones" but haven't really figured out how this is implemented. Based on the Draggable carousel I currently have in place, is there a straight forward way to let it run infinitely? It would basically continuously loop through if you swipe through or use the navigation arrows. Any help would be greatly appreciated.
  11. I would like to get the community’s input on some thoughts about the current state of interactive development. I have been a flash developer for the past decade, and like the rest of us, have adapted to industry dynamics now using JavaScript & CSS for interactive work previously done in Flash. Coming from a Flash background GSAP JS has been amazing and I have been able to do awesome work with it. My work, like the rest of us, involves using GSAP JS to animate and manipulate DOM elements to create interactive effects. My question is…is this really and truly HTML5? I was recently in a project team meeting getting compliments on the HTML5 project I recently did using GSAP JS. I’m sure it’s not uncommon for those of us using GSAP JS to get similar responses. Although I appreciate the positive feedback, I feel it is a bit misleading as I do not feel it is true HTML5. Yes, TweenMax can manipulate any JS property and canvas elements but I, and I believe the most of us, are simply using JavaScript to manipulate simple page DOM elements. As long as everything looks and works fine, a part of me wants to let people say and think what they like, but faced in front of a client is this appropriate to sell a feature or technology I do not feel is truly and technically HTML5? I would appreciate feedback on this subject.
  12. Thank you Jack for your feedback. It is very informative. Would it be possible to get a couple of references to iOS (iPhone/iPad) apps that we know have used the Throwprops plugin?
  13. I am looking to create an iPad app with an image gallery with a standard scrolling thumbnail tray that scrolls. Clicking on a thumbnail will launch a full sized image. The best example I've seen of this using Flash/AIR is with Redbull's Illume iPad app. Does anyone know if Throwprops was used for this scrolling panel used in the gallery thumbnails. If not, do you know if Throwprops can achieve this level of performance. The performance is indistinguishable from a native iOS app. I am definitely interested in becoming a Greensock member and getting the plugin and was just wondering if this is the performance we can expect with the Throwprops plugin. Any feedback would be greatly appreciated.