Jump to content


  • Posts

  • Joined

  • Last visited

Recent Profile Visitors

1,692 profile views

Ard's Achievements



  1. http://codepen.io/Ard/pen/aBWEYo I think I did it;)
  2. Okay, last question. My head is about to explode;) Why caption is visible? js line 117 and 119, the same pattern of action, one works well the other is not? timeline in js line 106 http://codepen.io/anon/pen/JbNRdQ
  3. I wish slider was more universal, but I do not know how to combine the functionality from previously created timeline. http://codepen.io/anon/pen/JbNRdQ -> copy from your example, I used fadeIn instead left transform. how to add a timeline from https://codepen.io/anon/pen/GNmozO? Create functions for entry and exit and add in gotoSlide()?
  4. Yes, thank you for your time and help. I also understood that I could add a "+=" which extends the duration of the caption. Currently it looks like this: https://codepen.io/anon/pen/GNmozO The last step is probably cleaning up and making this more universal
  5. Thanks. The first example seems to be what I need. Unfortunately, I still have some problems, maybe someone will be able to help me? 1) The first slide should begin with animation, but now is visible and after a while you can see action. I know this is probably fault .css and autoalpha how to get around this? 2) how to add duration? between input and output should be an interval lasting for x seconds. 3) as you can see, each slide operates on the same principle, and it's awfully silly to repeat. how to fix it? should be 2 timeline, and the interval between them to read the text? how to do this? New Pen: https://codepen.io/anon/pen/LbyVqm
  6. Hey, I wanted to make a slider, each slide should begin as animation example from codepen. Unfortunately, I have a problem with obtaining such an effect. Slider without navigation or dots, just interval every few seconds. The first slide should also appear with animation. I feel that the solution is very easy, and I sit on it far too long to find them. CodePen: http://codepen.io/anon/pen/mOmbza
  7. Thank you very much for your time and help! This is exactly what I wanted to achieve.
  8. Wow! Thank you very much for your time and help, especially the second post. Your code (approach) will help me in future projects. I have two questions: 1) All elements open from left to right. In the second column items should be opened from right to left. I tried to change the functions getPosition / layout, but unfortunately without success. Is it possible to do? Elements should not go beyond grid / container. 2) Below 600px animation should only change the height of the element. I understand that it is best to create another timeline and call it when you change the width of the window? Or should it just be found in the function buildTimeline? Regards http://codepen.io/Ard/pen/VjWYKP/
  9. Hello, Animation which I try to do, works well with computers or iPhone, but if it fires on Android it can munch, unfortunately, is not smooth. Maybe someone is able to help me in what I was doing wrong and how to improve? The code is a mess, but this is the first time I try to move animations from CSS to JS. The alpha version for phones was not very smooth and able to "trim". After using GSAP is much better, but it seems to me that it might be better. In addition, some questions (GSAP, JS, CSS): 1) The problem with the grid. I can not set the width (50%) plus a margin? The elements are in absolute position, otherwise when opening the remaining contents can jump. If I use the width: calc () animation can behave strangely. I tried to change position relative to the absolute (in animation), but without success. In the version of the tablet / desktop grid of 100% is replaced by 50% in 2 rows. 2) FadeOut flashes. I'm not sure what causes this? It seemed to me that zIndex, but probably not? 3) I do not know how to get 100% of the width div before animation? now the value entered is rigidly spoil responsiveness (width: '375.5px' or width '457.5px') 4) Literature, which will allow me to expand my knowledge? I know that's a lot, but maybe someone will help me? Sorry for bad english. Regards Links: http://codepen.io/Ard/pen/rLmRwK http://codepen.io/Ard/full/rLmRwK/