Search the Community
Showing results for tags 'resizing'.
Found 3 results
-
Hi there! I am trying to create a slider that shows a number, depending on its position (like an input range with a number directly on the thumb) using the Draggable plugin. I have defined a bounds object to keep the slider within these bounds. However, since the thumb's size increases during dragging, the thumb does not stay within the bounds all the time. Draggable allows the thumb to move into a position that would have kept it in its original bounds (not its updated bounds). The issue becomes apparent if you try to drag the slider from 1 to 100 in one go. Notice also, when you arrive at 100 and then let go, the slider snaps into the correct position. How can I change my setup to make sure that the slider stays within the bounds at all times? Thanks!
-
Wassup, GSAP! My goal is to build a dynamic sections container, which should be adaptive. Some of the sections should have height: 100vh; While I resizing my viewport`s height (perfectly repeats at codeOpen (especially when resizing fast)) my sections are resizing too. While all of my section are position: absolute; (for other section animation types) I have to set their top: property manually via gsap.set({ }) I also noticed that scrollTrigger refreshes a while longer than window.onresize, and i have to handle resize by scrollTrigger`s onRefresh It works perfect, until I pin one of the sections. After that, my pinned section starting to have some wierd top offset value (screenshot). I`m missing something essential here, console.log says that my top calculations are correct, but my top value is overwriting by something. Plus, I still cant get if there is a possibility to refresh markers ( and ScrollTrigger start-end behavior ) in a correct way.
-
hi, thank you for this great and useful tool. my xml: <data> <ImageLoader name="digital_01" url="imgs/digital_01.jpg" centerRegistration="true" width="640" height="400" twx="342" twy="391" kw="230" kh="200" load="true"/> <ImageLoader name="digital_02" url="imgs/digital_02.jpg" centerRegistration="true" width="734" height="400" twx="594" twy="389" kw="215" kh="192" load="true"/> </data> as3: var queue_xml:XMLLoader = new XMLLoader("imgs/digitals.xml", {name:"digitalsXML", maxConnections:1, estimatedBytes:5000, onChildComplete:imageCompleteHandler, onComplete:queueCompleteHandler}); queue_xml.load(); var img_xml:XML = new XML; function imageCompleteHandler(event:LoaderEvent):void { addChild(event.target.content as ContentDisplay); img_xml = LoaderMax.getLoader(event.target.name).vars.rawXML; //i want to scale down images for using them as thumbnails too TweenMax.to(event.target.content, 0, {autoAlpha:0.2, blurFilter:{blurX:5, blurY:5}, width:img_xml.@kw, height:img_xml.@kh, x:img_xml.@twx, y:img_xml.@twy}); trace("original image value:"+ img_xml.@width +", xml thumbnail size(kw) value:"+ img_xml.@kw +", current image value:"+ event.target.content.width); // trace result for first //original image value:640, xml thumbnail size(kw) value:230, current image value:820 //trace result for second //original image value:734, xml thumbnail size(kw) value:215, current image value:1095 } function queueCompleteHandler(event:LoaderEvent):void { } problem: my images bigger than its actual size but i want them smaller. when i set kw or kh to negative values, result is what i want. btw this is my first project with greensock tools.
