klevron/threejs-toys

Neon Cursor issue

andrevdyk opened this issue · 2 comments

          Hello @PythonCoderUnicorn, thanks for using this toy !

Any error in console ?

Originally posted by @klevron in #2 (comment)

Hi there, ive been trying for hours to get this right, I believe it may be due to stupidity on my end. Working on getting the neon cursor to work . I have installed three through npm. Is there anything I am doing wrong. Made a new html page but still cant get it to run.

<style> body, html, #app { margin: 0; width: 100%; height: 100%; background-color: black; }

#app {
overflow: hidden;
touch-action: pan-up;
color: #ffffff;
font-family: 'Montserrat', sans-serif;
text-align: center;
text-shadow: 0 0 2px red, 0 0 2px green, 0 0 2px blue;
}

#app a {
margin-top: 10px;
display: inline-block;
text-decoration: none;
color: #fff;
}

#app canvas {
display: block;
position: fixed;
z-index: -1;
top: 0;
}
</style>

<script type="module"> import { neonCursor } from 'https://unpkg.com/threejs-toys@0.0.2/build/threejs-toys.module.cdn.min.js' neonCursor({ el: document.getElementById('app'), shaderPoints: 20, curvePoints: 40, curveLerp: 0.8, radius1: 1, radius2: 0.9, velocityTreshold: 1000, sleepRadiusX: 5, sleepRadiusY: 5, sleepTimeCoefX: 0.0025, sleepTimeCoefY: 0.0025, }); </script>

Hello! Thanks for your project! How to offset neon circle by y coordinate?