Hide Mesh Overlap But Still Display Non-Overlapping Mesh

Questions
1

I have 2 3D objects of clothing items (as seen in the pictures). Without scaling, how can I hide the black jacket under the blue hoodie so that all parts where the black hoodie overlap the blue would not show up. Ideally, if I was to unzip the hoodie, only the front side of the black jacket can be seen (where the blue hoodie is no longer covering the black jacket). I apologize if it’s a little confusing; you can just imagine how you would layer a jacket over a hoodie/shirt in real life --that’s all I’m trying to achieve here.

I followed this example: http://jsfiddle.net/Horsetopus/33623mpv/ and got the blue hoodie to show up in front of the black jacket. But all this does is render the blue hoodie in front without actually hiding the jacket. I’m new to three.js so I would really appreciate the help.

5

@Mugen87
As you can see from the photos, I can’t scale because I need the blue hoodie to be the same size as the addidas jacket. I just need the parts where the addidas jacket crosses over the blue hoodie to be hidden. The photos also illustrate what I was saying earlier; I was able to “display the mesh on top” but all that does is render the blue hoodie in front–it’s not actually blocking the overlapping parts. Sorry for the confusion.

6

Hey Ayma
I am looking for similar solution. I want to make a window to a wall, where i can place window, that should make me see on other side of wall.