https://klever-talha.github.io/
The 3d model on the page follows the mouse when left clicked. But I want to know how can I make it move without the click. It should always face the cursor pointer. I have used THREE.JS for this. So any idea, can it be done by orbital control, or do I have to add some extra javascript for that.
I did something similar recently for a students lesson. Here is an example:
https://tweeter-soup.herokuapp.com/
here is the repo for the three.js code:
https://github.com/soupIsTheCurrencyOfTheFuture/tweeter/blob/main/public/scripts/profile-icon.js
window.addEventListener('mousemove', (event) => {
modelGroup.rotation.y = (event.clientX / window.innerWidth) - 0.5;
modelGroup.rotation.x = (event.clientY / window.innerHeight) - 0.5;
modelGroup.position.x = ((event.clientX / window.innerWidth) - 0.5) * 15;
modelGroup.position.y = ((event.clientY / window.innerHeight) - 0.5) * -15;
});
here is the event listener.
you should be able to just change your current onclick event listener to a mousemove and you should be set though