Interactive photo - how?

Interactive photo - how?
0

#1

Hello guys, please don’t be mad on me but I don’t know how to explain my problem. I’m trying to make interactive photo ( I split my bacground pohoto on two parts) while I hover on right part (the photo for example will zoom in) but there is problem with transparent background in png, it take to much space and cover a left part photo. Is there a way to remove unnecessary invisible background ? Here’s my project:

https://codepen.io/Marcin03/pen/ZOqWBY


#2

Hey, can’t you just crop the photo with whatever tool you want? BTW: maybe you will like transition, add this:
.multi_bg2{ transition: all 0.2s; }


#3

Thank you for suggest ! When I crop the photo by cssplant.com my all croping shape going wrong…
http://codepen.io/Marcin03/pen/OXBqqy Have you any idea how to fix this ? :slight_smile:


#4

And if you use paint (if you are on windows)?


#5

Yes, I’m on windows. I can’t use a paint beacause if I save a photo there will be a white background and I don’t know if there is a way to delete picutre’s background in css. This is my biggest problem… The width of the entire image take 1300px but only where soldiers are take 600px.


#6

Maybe this helps.


#7

Thank you for help but pen doen’t display correctly for me :frowning:


#8

I know, but you can change the link to a random picture. Or use this