How do I place 2D text over 3D card element?

oh that’s pretty cool, I love the infinite dragging :+1: here - I copied that to jsfiddle because I hate codepen

1 Like

ok but can you try to add the 3d card over text here , and text should be show by card hover. i think you can do because you already shown a video

reading the code, it is actually not too hard - you have to change init(el, i) method. basically, it gets called with the image elements (<figure>-s, to be precise) and you want it to be called with <div>-s instead. this way, you can put the text into those <div>-s and then use html2canvas instead of

this.texture = loader.load(this.el.dataset.src, (texture) => {

this.

2 Likes

kindly can you pleas write code here ‘jsfiddle’ https://jsfiddle.net/z6q01xto/

what do you know, I actually did that but before I could save my browser crashed :pensive: I am pissed and I am not doing this again.

7 Likes

can you write your local and can give me this code file by github or drive?

Hi! can you pleas try one more time, do code o jsfiddle that should be understandable. also i have done the dragging and animation part i need as same as your view card hover over text https://codepen.io/ReGGae/pen/eYGyLrP

Sorry, but I won’t do your job for you.
If you want something to be done, do it yourself.
You’ve been provided with many ideas and advice.

6 Likes

ok just share you thought, how you make using css2d, as you share your video.thats should be helped me

Looking into the source code of the provided example :thinking:

2 Likes

Hi! you read the source, pleas give me some hints abouty our video css2d hover over text pleas!

This can be a good start https://codepen.io/chungeric/full/oNEoKjg

1 Like

Hi! @naonao_naonvl thanks for youe preview, but i want here hover with text also.i mean when user hover the card each card show diffarent text . can you pleas do this also pleas!!

Here are cards that can each show different text when hovering: https://codepen.io/haroldiedema/pen/XWOZJZd

2 Likes

thanks but, i thin you are not understood my point. Sorry! i mean here mouse drag with hover over each card text,https://codepen.io/chungeric/full/oNEoKjg see here i want like this drag with each card hover over text

Sure, I’ve updated the codepen.

1 Like

Thanks but, if you see clearly its need infinity dragging any direction with smoothly, you can use html element to 3d ,use three.js.and you can use this code and maked here each card hover over text https://jsfiddle.net/z6q01xto/

Oh I’m sorry, but that is impossible in my current implementation and budget.

In all seriousness though, I think you should update (or create a new post) as a “job” rather than a “question” and offer payment. Seeing how quick you are to respond to messages (not taking any time reading/learning the source code that is provided to you), it’s clear you’re looking for something to do the job for you, instead of giving you advice on how to achieve it by yourself.

1 Like

ok thanks! i already maked this and achiived this using html element to 3d ,trying to improved my code, also thanks for helped me by giving some idea, last question is how much budget for its possible?

i think u can try inspecting this file

image

that file contains the threejs code for the website