Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

Design

Cool looking website background effects examples- "how is it made" question

Hello, there is this "OZORA festival" webpage:

https://2017.ozorafestival.eu/ (I had to open it on my android phone to make effect work- I don't know why, but sometimes it works on PC or notebook, sometimes it's not)

https://2018.ozorafestival.eu/ - this always works, effect is also present but it's not as interesting as 2017 one.

And as you can see, these pages have really cool-looking background zooming effect - I wondered how did they make it. Whole thing looks like it would be one big, high-resolution image, which gets zoomed all the time. But I don't think it's made that way.

One solution that comes to my mind is array of high-quality pictures and reloading of each picture at some point, where change is not noticeable, with setInterval for example. And zooming effect with css-transitions. But I wonder if it wouldn't make any lag or image loading visible.

Another great looking effect:

https://2016.ozorafestival.eu/ (this festival feels like an effects mine :D ) .

http://www.tedxbethesda.com/

Is it some kind of 3d model incorporated into website with javascript or something else? Can you actually do THESE things with plain javascript?

Are there any libraries which specialize in doing such a things? Who does that? UI/UX designer, front-end developer, or just some "creative personality" ? :D

Also If you have any other examples of creativity, feel free to post them here.

Thanks!

1 Answer

Clayton Perszyk
MOD
Clayton Perszyk
Treehouse Moderator 48,565 Points

It looks like ozorafestival uses wordpress; and within the wordpress app it's using jquery.

If you inspect the page source, you will see that they are using jquery zoom functionality.