Подскажите как можно реализовать данную задачу: https://web.archive.org/web/20160206132423/https://laragon.org/ Или может есть где-то пример. При движении мышки, на заднем фоне рандомно рисуются объекты по точкам и совсем непонятно как это реализовано. Не уверен, но возможно это js.
Там там же все есть. Код в файле подключается и в нужном месте вставляется Код: <canvas id="constellationel"></canvas> Или еще так можно Или найти, по запросу Constellation effect или particles effect, примеров много.
я вообще не там смотрел... копирую то что в codepen себе и у меня ничего не пашет почему такое может быть? --- Добавлено, 30 июл 2019 --- Я вот закинул с другого ресурса: http://particles.bestcard.dtraduga.vh55.hosterby.com/ Вот сам ресурс: https://vincentgarreau.com/particles.js/#default Но не могу понять как сделать чтобы линии всегда были четкими а не плавно пропадали и появлялись Мне нужно чтобы они резко появлялись и пропадали как тут: https://web.archive.org/web/20160206132423/https://laragon.org/ --- Добавлено, 30 июл 2019 --- А можно ли particles как-то повесить на body? --- Добавлено, 30 июл 2019 --- Я к тому, что нужно получить такой результат: http://prntscr.com/om1fyd По центру страницы вебплеер, а под ним партиклс... только вот как? Родителю плеера text-align: center и плеер центрируется, но партикл под ним ниже, position: absolute и партикл под ним как положено, но тогда центрирование плеера улетает.... ух.... что-то я сегодня туплю (( --- Добавлено, 30 июл 2019 --- Вот что у мня по итогу получилось: http://particles.bestcard.dtraduga.vh55.hosterby.com/ Но при таком раскладе плеер не центрируется (((
А что я говорил про абсолютное позиционирование? Уберите с .areelle абсолютное позиционирование и добавьте его на канвас. Раз канвас - фон, то именно у него должно оно быть. А у .areelle вот это: Код: .areelle { position: relative; z-index: 1; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; } И видео будет по центру страницы.
Да, все правильно, видимо меня надо пару раз ткнуть носом в одно и тоже Единственное непонятно тогда, что делать если нельзя использовать абсолютное позиционирование и добиться вот такого результата? чтобы все было вокруг плеера: http://prntscr.com/ombacj На данный момент у мня так получается: http://prntscr.com/omb6a2 Когда вешаешь на ариэль абсолют, то все как надо: http://prntscr.com/ombbtu Но это неправильно... И получается если неправильно делать и вешать абсолют на ариэль то естественно на движение мыши партиклс уже не реагирует
Тогда нужно вообще убрать areelle. Мне изначально было не очень понятно зачем эта лишняя обёртка. На #particles-js уже есть правильные стили. Надо туда добавить только это: Код: display: flex; align-items: center; justify-content: center; И на video это: Код: position: relative; z-index: 1; И как я уже писал выше:
что-то я немного не понял... сейчас попробую повторить --- Добавлено, 31 июл 2019 --- Вроде все норм как сказали так и сделал, но канва реагировать перестала --- Добавлено, 31 июл 2019 --- Вроде разобрался
Вижу, что уже всё правильно. Правда, вместо видео теперь картинка. И обратите внимание на эти стили: Именно они центрируют сейчас картинку. В былые времена могли понадобиться танцы с бубном, но сейчас есть флексбокс. Первая строка его включает, вторая центрирует содержимое блока по вертикали, а третья - по горизонтали.