I’m not sure if anyone knows of a plugin, or a practical way to achieve this little challenge I have!
I need to display an image of a window which resizes based on inputs.
I think maybe the image could be a shape, but I need basic lines to illustrate the partition between window openers so users can see what they are buying.
See the image below, there will be inputs to add height and width and the image needs to adjust to retain it’s proportions. May vector pictures?
Hi! You could do it with Vectors (for complex shapes) but also with plain html, i don’t know your coding knowlege, but it could be done with simple html, css, js. I wrote a simple code snippet using html, css, js. i’m pretty sure that it can be done in Bubble using an HTML element in the editor and updating the code dynamically.
It doesn’t change the proportions 100% accurate, but the general idea is working, you could edit the styles/refactor the code a little bit and it should work, the lines could be printed in the glasses with js+css, what you should do is converting the real life width/heights from cms to px.
Sorry @lottemint.md for some reason I thought I had replied … wow your solution works very nicely and I love the smooth animation as the shape resizes. I am going to look at yoru editor and see how you achieved it … thanks!
Hi @lottemint.md I have been trying to recreate what you have done but only the height is adjustable? Can you spot anything I am missing from this test page? [feel free to edit it if easier]. Thanks in advance!