Jump to content


  • Posts

  • Joined

  • Last visited

Profile Information

  • Gender
  • Location
    Orange County, California

jemfrim949's Achievements



  1. I am working with the tween.from(element,duration,etc). There are two tweening properties I would like to do: First, I would like to make elements enter the page from the top or bottom of the viewport. I can make them enter from the left side or the right side. What is the property you pass to create vertical movement? Second, I would like to move an element within a fixed dive. During the animation, I would also like the element to be diplay:hidden until it enters the element. the homepage banner is a perfect example of what I am looking to create. Here is the simplified code I am running on my site now. http://codepen.io/anon/pen/gnImi cheers!
  2. Thanks Jonathan, I ended up using the first method (timeline is next weeks lesson). The button looks great! cheers
  3. Jonathan, Here is an example of how I would go about combining two different tweens into one. http://codepen.io/anon/pen/CacAg In this particular codpen I am trying to create a pulsating border while changing the background color and font color when the user hovers over the button. The pulse uses the .fromTo() while the background color and font color uses a .tweenLite() The code above allows for one or the other to work but not both simultaneously. How would I make them both work at the same time when hovering over? cheers
  4. Thanks for the codepen the pulse animation looks a lot better now. I still cannot get the background color to shift to black and the text color to white upon mouse enter. here is my updated codepen
  5. I am working with the 3d animation box shadowing effect. I am able to get the design I want however the hover effects are occuring onload instead of when the mouse is hovering over. here is my codpen How do I make it so the green border and black background only appear when hovering? Note: sometimes the green pulse only occurs on hover (I would say it works) however the black background comes in permanently when it should only turn black on hover. cheers
  6. I really cannot thank the two of you enough for the help! Jonathan, How do I code multiple tweens on one element, such as an anchor tag, I was fiddling around with this idea to no avail. Thanks again!
  7. Thanks Rodrigo, I dont have a reason for using the section for the event listener. what should I make the event listener look to? when I swithch it to btnAnimate i loose all the hover properties. I changed the code for the best practice and have the background fill but am still struggling with the font color. Would this be something in my css that needs to change? also, do you know how I would use jquery instead of js to accomplish the same task? Cheer
  8. Hello, I and trying to replicate the hover box shadow tweens from the GASP site http://www.greensock.com/css3/ in this case under the box shadow section the "white blur button". I can get the box shadow to appear but the background color and font color do not switch to my tweened properties upon mouseEnter. Here is my codepen http://codepen.io/anon/pen/hcdtb How do I get the background color and font color to change too? Cheers
  9. HI, I thought I made progress with a previous post on button hover 3d animation- guess not. It was explained very well but for some reason I am not able to translate it to other GASP box shadow styles. http://forums.greensock.com/topic/9355-how-to-animate-buttons-on-hover-with-gsap/ I am trying to work my way up through the different 3d box shadow properties located here: http://www.greensock.com/css3/ this time I am working on the orange blur box shadow. Here is my code: http://codepen.io/anon/pen/bkBLa My end goal is to have these box shadow properties to run when user hovers on any buttons on my site.
  10. Hello, I am a fan of the 3d button hover options under the Box Shadow section shown on this page http://www.greensock.com/css3/ I am attempting to replicate the box titled "sharp shadow" (with then end goal of moving up to the more complex box shadow features in that section) Conceptually I am not understanding how to activate a hover design animation with tweens. I have attached a codepen where I have the design ready to go when the page loads; however, nothing is happening. http://codepen.io/anon/pen/vzjDB/ Cheers In advance! (PS Newbie)
  11. Hi, I like the bar/ logo delay animation showed in the jumpstart section http://www.greensock.com/jump-start-js/#delay The green bar in the example runs from left to right. Is there a way to run this bar animation from right to left?
  12. Thanks @jamiejefferson, I figured the issue was coming from the windows.onload function; however, I am so new to JS that I didnt know what other function to call. Cheers
  13. I would like to combine two tweenlite scripts with one tweenMax script. If I dont include the tweenMax the tweenLite script executes and vis versa. Can you simultaneously run tweenMax tweens and tweenLites? If so how? CodpenLink: http://codepen.io/anon/pen/JvcEt/ Note:Orange Block represents the logo Cheers