Jump to content

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


  • Content Count

  • Joined

  • Last visited

Community Reputation

2 Newbie

About dotun12

  • Rank
  1. Dipscom, I have done that but still did not work.
  2. thanks zachsaucier, I have made the change to ScrollTrigger.create but still did not work.
  3. Hi there I am trying to change the color of the menu, once I scroll to the a section, i try to toggle the class but did not work. secondly, I want to also scale the border line only in the menu on mouse, not together with the text, the text(menu) should not scale only the border line. thanks
  4. HI, I am trying to work on a page scroll effect with GSAP , I am imitation the exact below link (See imitation sample) also with the navigation arrow when click it scroll down to the next page and lastly can you help add auto scroll also. See imitation sample https://codyhouse.co/demo/page-scroll-effects/catch-hijacking.html I'd appreciate your help.
  5. Hi ZachSaucier, I added 'once: true', but did not work ScrollTrigger.create({ animation: tl, trigger: sec, markers: true, start: 'top top', end: 'top', scrub: 2, once: true });
  6. Thank, ZachSaucier, one more thing I want the content to appear once, not appear anytime scroll up or down.
  7. Hi ZachSaucier, I have added the codepen, if you notice when the scoller line get to the first start line it show all the content for all section, but I want it to only show the content for that section.
  8. I want to use the same animation and same trigger element for different content in a section. <section class="sec"> <h4><span class="animation">Section content 1</span></h4> <p><span class="animation">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc gravida imperdiet</span></p> </section> <section class="sec"> <h4><span class="animation">Section content 2</span></h4> <p><span class="animation">Lorem ipsum dolor sit amet, consectetur adipiscing
  9. Thanks, ZachSaucier for your respond and mikel I am grateful.
  10. Hi there, I am trying to make a div(#rec) follow an svg path with I did in my below code but, I want the div to follow down, as I scroll down and follow back up as I scroll up, I will appreciate if you help work on the code below, Thanks https://codepen.io/onseyi/project/editor/DeWepm <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> body { margin:0; width: 100%; height:
  11. I am trying to make a simple overlay transition effect with barba and gsap. when I click on the Page 02 link the overlay transition effect move across the page from left to right but the page did not change, I will have to click on the link the second time for the page to change how can I fix this thanks. Barba.Pjax.start(); var FadeTransition = Barba.BaseTransition.extend({ start: function() { Promise .all([this.newContainerLoading, this.fadeOut()]) .then(this.fadeIn.bind(this)); }, fadeOut: function() { const TransitionPromise = new Prom
  12. ZachSaucier, when I try to remove all line of code that as to do with the drag, the page was displaying blank, can you please point me to the part I need to remove thanks. below is the code section I remove // make the whole thing draggable var dragMe = Draggable.create(container, { type: "x", edgeResistance: 1, snap: offsets, throwProps:true, bounds: "#masterWrap", onDrag: tweenDot, onThrowUpdate: tweenDot, onDragEnd: slideAnim, allowNativeTouchScrolling: false, zIndexBoost:false }); <script src='https://cdnjs.cloudflare.com/ajax/libs
  13. Thank ZachSaucier, I want to disable the drag, I only need the scroll and the next / prev button should I just remove this part of the code var dragMe = Draggable.create(container, {})
  14. Hi there, I am trying to add a next and previous button to the scroll slider (see codepen), so that when you click on next it move to the next slider page, and also maintain the scroll on the slider. I tried to add the below code but did not work <div class="controls"> <button id="prevButton">Prev</button> <button id="nextButton">Next</button> </div> var prevButton = document.querySelector("#prevButton"); var nextButton = document.querySelector("#nextButton"); prevButton.addEventListener("click", function()