Search the Community
Showing results for tags 'zooming'.
Found 6 results
-
Hello everyone, I hope you're doing well. I'm seeking immediate assistance with a topic concerning horizontal scrolling. Initially, I have an image that needs to be zoomed (scaled) from the center to the top, and then further zoomed into the center (the zooming functionality is currently working fine). Following that, I need to implement a horizontal scroll to the right. When the left edge of the text card reaches the center of the viewport, it should reveal a line (desktop-line-animation) towards the image, which is positioned halfway on the left side. The scrolling should be pinned while extending and reducing the line. Once the line is completely revealed, scrolling should continue, and the text needs to change to new content until the video comes fully into view, at which point the scrolling ends. I've been using stops, but currently, everything occurs after the image has finished zooming and before scrolling starts, resulting in a significant delay. Any suggestions or improvements to optimize this process would be greatly appreciated. I'll attach a desing and to show you how it should look like:
-
Hola, I am implementing zoom in and out functionality in svg using wheel eventListener in js. How ever the zoom in and out works fine. But the transform origin of the svg g is at 50 % and 50% so it zoom's in only towrads those points, even when the center 50%, 50% is not in view, I've tried it using the methode of finding the transform origin for the box that is in view then using that tranform origin it zoom in and out but i failed because the values in console were of the start transform origin of box g when it was rendered. I know their is some cleaner way to implement this since am newie don't know much tricks. It will be really appreciated if some one can help me out it this. I have provided the codepen. Thanks ?
-
Hi, I want to do this video. All content goes to the center in Zoom in/out. Could you please give me a hint? Video link: https://fiverr-res.cloudinary.com/video/upload/t_fiverr_hd/v1/video-secured-attachments/messaging_message/attachment/a5379de46d077980d280c733bfd23b85-1685272686476/IMG_9314?__cld_token__=exp=1685404524~hmac=229d38e5b3974e0de4b36336812a7fc3054ea9fc49cd79f5f6b0ae04f7de8180 -
Hallo! So this is a minimal version of the thing I'm actually working on, but essentially it's a map of a campus. Dragging works great, and zooming works fine; but what I'm trying to achieve is, whenever you click on a 'building' (read: brightly-coloured block), it moves to the left side of the viewport, vertically centred. I'm using data-attributes on my buildings for this, and I thought I had it, but: a) it doesn't account for different viewport sizes (so it's not vertically centred); and 2) once you zoom in, that positioning all goes out the window, and clicking on a building doesn't put it anywhere near the intended place. I just realised I might be able to get away with resetting the zoom level to 1 whenever someone clicks on a building (maybe?), so at least the x co-ords would (probably?) still work; but the vertical centring is a bust no matter what. Maths is not my strong suit, so any ideas on how to tackle this would be gratefully received ? -
I'm trying to zoom in into the video playing in laptop but the problem is the image that scale it appeared in the bottom of page , how can I hide it
-
Hi guys, i've been working with your Draggable library and got this issue: i've got an container which contains my draggable object i've got a input slider to zoom in/out my object zooming through CSS transform: scale() when zoomed in/out and dragging to autoscroll, my object will move away Any suggestion how to zoom in/out the object and using autoscroll without my object moving away of the mouse pointer? Thanks
