Как сделать эффект блика для кнопки в Zero Block на Tilda.

[@victoriatishi1507]

Потратила три часа на поиск информации как сделать эффект блика в зеро-блоке. И только благодаря вашему видео наконец-то получилось! Спасибо вам! Спасибо что решили записать видео по этой теме.☺

[@aleksandr-nedilko]

Спасибо !!! В 2022 все еще актуально!

[@zarasavi5732]

Огромное спасибо. Все понятно и получилось с первого раза. Даже код дали бесплатно. Человечище

[@annavysoko]

Мужик, спасибо, спас прям ваще. Дизлайкают те, кто неправильно вставляют идентификатор

[@Алина-л7з5ч]

Вы мне просто жизнь спасли, Я до этого делала по видео мо тильда, добавляла ещё один код к основному и у меня выходила анимация почему-то на весь сайт, на все элементы зеро-блока🤯

[@ЛизаАфонькова]

Спасибо вам огромное! Много видео пересмотрела про этот эффект, и никак не получалось его сделать, после вашего подробного объяснения все получилось! 🤩😁

[@Vogue21Model]

Огромное спасибо! Очень помогло!

[@PROTARGET-mx4pr]

Мужик, ты лучший!

[@ЕленаРайт-р6ф]

Спасибо, Александр! сейчас попробую

[@Стоитзадуматься-щ6х]

Спасибо Александр!

[@АнастасияСидорова-р7р]

большое спасибо за ролик!

[@Dikaya_Territoriya]

Сенкью вери матч) работает!)

[@АлександрДемченко-х9к]

Круто! Очень ценная информация! Александр, спасибо огромное! Жму руку!

[@aaaaaaey]

Спасибо!! Очень помогли)

[@МартаВьюшкова]

Спасибо большое, вы мне опять помогли в очередной раз)Все получилось

[@АврораМин-б5з]

Спасибо большое!! Успехов вам!!

[@aleksandradeeva]

спасибо! легко получилось

[@Markellin]

Большое спасибо, помогло!👍

[@artur_ainet]

Большое спасибо! Удалось решить свой вопрос с помощью вашего видео.

[@GREDIES-y3h]

Спасибо,искал долго

[@МаргаритаАлешина-н1ч]

спасибо мужик!! все работает

[@user-sj8is5]

Пасеба=)))))) получилось!

[@carinabianca6236]

Благодарю!!! Очень полезно!!!

[@Ray-xi8qt]

Огромное спасибо! Желаю вашему каналу процветания ;)

[@ibrakhimsaliyev6540]

Ты огромный молодец!

[@ЮлияИзотова-е1т]

Спасибо! Четко и по делу!!

[@КкккСссс-ь9р]

супер, получился

[@unreal_webdesign]

спасибо большое за урок, получилось!

[@veaceslavbejan2332]

Красава,большое спасибо!

[@chris_morozova]

Спасибо большое!)

[@Ilya-dubkov]

Спасибо =) Полезно! Рабоатет)

[@ГульфиназИльясова.Коллекцияхри]

Спасибо!Круто!

[@ГеоргийНауменко-ъ9в]

Большое спасибо!

[@МихаилАндреев-щ9ь]

выходит за края кнопки анимация, на темном фоне видно

[@alexpol7843]

Код для блика не работает в формах. Есть код который делает блик на кнопках в формах?

[@Me_Aygul]

привет! вы нашли способ добавить блик в формах? :)

[@ЕлизаветаА-к6п]

@@Me_Aygul перейдите по ссылке в описании, там внизу есть код для добавления блика на кнопку в форме :)

[@ireksf]

а в формах это как?

[@ЕлизаветаА-к6п]

@@ireksf в формах заявок, то есть не в кастомной кнопке в зеро блоке, а например в поп апе или шаблонный форме

[@OlgaVeligon]

Благодарю!!!

[@LeylaRiccucci]

спасибо огромное за полезность

[@anastasiyakomogortseva4607]

спасибо, полезно. все получилось!

[@evgenikraiuschin8086]

спасибо интересно

[@ПавлоБондаренк-0]

А если в блоке сразу несколько кнопок, надо на каждую кнопку отдельно создавать html блок и вписывать туда разные идентификаторы кнопок, или можно в один как то сразу добавить все кнопки?

[@alexantipin]

Как и везде в одном коде через запятую сколько угодно

[@FeyKor]

СДЕЛАЛ ЧЕРЕЗ ЗАПЯТУЮ И НИЧЕГО, ПЕРЕСТАЛА РАБОТАТЬ ДАЖЕ ПЕРВАЯ КНОПКА( В ЧЕМ МОЖЕТ БЫТЬ ПРОБЛЕМА?@@alexantipin

[@alexantipin]

@@FeyKor проверьте внимательней, так как любой символ лишний или не доставленный может поломать работу скрипта. Вот так должно быть '#rec146040325 .tn-elem[data-elem-id="1566119404248"] .tn-atom, #rec146040456 .tn-elem[data-elem-id="1566119405475"] .tn-atom' Тут пример для 2-х кнопок, но у вас будут свои ID блоков и кнопок

[@acdancealeksconstance5405]

подскажите, а как сделать тоже самое, но с кнопкой в обычном блоке? Не вижу в настройках блока PL100N анимации кнопок.

[@alexantipin]

Этот скрипт для кнопок в зеро блоке. К сожалению не могу вам подсказать как сделать такой эффект для блока PL100N

[@anastasiiasavvinova8011]

спасибо огромное!!

[@orbunb.213]

спасибо большое! )

[@ВалентинаКарамергенова-д8ж]

Здравствуйте, спасибо что делитесь , подскажите возможно ли в зеро блоке сделать под меня

[@alexantipin]

Здравствуйте, может вы имели ввиду под меню? Если да то можно опять же есть разные способы.

[@ВалентинаКарамергенова-д8ж]

@@alexantipin да под меню))))) опечатка, а где можно посмотреть видео уроки?

[@alexantipin]

@@ВалентинаКарамергенова-д8ж Видео уроков к сожалению не знаю, поищите в ютубе, но в Тильда есть уже не плохие меню второго уровня, это блоки: ME601A и ME601B или как вариант попробуйте поиграть с этим скриптом mo-ti.ru/zerotabmenu

[@ЭрнестМаркосян-о6о]

а подскажите как установить другие эффекты с того же сайта. Что куда прописывать нужно ?

[@alexantipin]

На этой странице только этот эффект, других на моём сайте для блика нет к сожалению.

[@Lampada_granit]

А кнопку заказать в магазине можна так сделать? Тобто в корзину, или купить ето былоб круто.

[@alexantipin]

Этот скрипт только для зеро блока, к сожалению для товаров у меня нет скрипта :(

[@antonbazunov5173]

Скажите пожалуйста, как применить эффект блика для кнопки в зеро блоке в форме, в самой форме не могу найти код кнопки либо только вариант как у вас в другом видео, удалить из формы кнопку, сделать свою и потом подключить эффект? Спасибо

[@alexantipin]

Добрый день, если скинете почту на которую вам скинуть скрипт, я вам его скину (для формы в зеро)

[@antonbazunov5173]

@@alexantipin Добрый день, было бы отлично ! [e-mail]

[@АлексейБарышев-щ6я]

@@alexantipin Можно и мне? [e-mail]

[@ДамирХайров-з2е]

@@alexantipin можете тоже прислать код на почту [e-mail]? или где посмотреть инструкцию на этот счет. Заранее благодарю!

[@VTL7]

@@alexantipin Можете и на мою скинуть пожалуйста. Большое спасибо - [e-mail]

[@dbazyko]

Спасибо

[@Ирина-и7д-ф5й]

Здравствуйте.. Все сделала, как вы ппоказываете, но эффекта нет. Есть ли какая то мысль , почему такое может быть. создавала новый зеро и новую кнопку все равно не работает.

[@alexantipin]

Здравствуйте! Должно всё работать если правильно настроили, недавно в Тильда переставали работать сторонние скрипты на многих аккаунтах, рекомендую проверить библиотеку jQuery - Настройки сайта > Еще > Подключить jQuery на страницах сайта. должна стоять галочка в нужной строке. Или как вариант добавить в основной хеадер вот такую строку - Может быть из- за этого :)

[@Ирина-и7д-ф5й]

@@alexantipin спасибо за помощь. Попробую.

[@Ирина-и7д-ф5й]

@@alexantipin помогло

[@Здравствуйте-уважаемый]

Здравствуйте! Подскажите, пожалуйста, как сделать, чтобы блик более плавно проходил? Сейчас он прям проносится, а хочется, чтобы более медленно "протекал" по кнопке. Спасибо.

[@alexantipin]

Здравствуйте! Найдите 5 строк в которых указано значение 3s это скорость и одновременно промежуток между бликом, поменяйте во всех строках 3 на нужную вам, по экспеременитуйте.

[@Здравствуйте-уважаемый]

@@alexantipin спасибо!

[@ОльгаЕфремова-ч6т]

Сделала все по иструкции, перепроверила 10 раз, кнопка увеличилась, анимаци проходит только при загрузке страницы. потом ее нет... как исправить ошибку?

[@alexantipin]

Добрый день, я к сожалению не смогу вам подсказать ошибку не увидев проблему, у меня и у моих заказчиков всё работает

[@olesyashevchenko77]

Подскажите. такой код можно вставить в ТАПЛИНК? или он только для тильды

[@matricia_de_rinella]

У меня на компьютерной версии этот эффект по высоте режет кнопку, и не полностью ее покрывает, на телефоне все ок, а в комп версии и планшет , проблема, меняла высоту со 100% на 150%, ничего не поменялось. Не знаю что делать(

[@alexantipin]

Вам нужно поиграть с этими значениями во второй строке, после тега под ним строка : 60px;width: 40px;top: 0px;left: -140px

[@matricia_de_rinella]

@@alexantipin окей попробую спасибо

[@АлинаГончар-э1п]

Подскажите, а почему эффект блика не срабатывает, когда я скопировала эту кнопку в другой блок? Как сделать, чтобы этот эффект был на всех кнопках на сайте?

[@alexantipin]

В другом блоке у кнопки меняется ID который вы вставили в код, вам нужно через запятую добавить ID в код дублированной кнопки.

[@АлинаГончар-э1п]

@@alexantipin спасибо! получилось)

[@Ардашка]

Здравствуйте. Можете отправить код блика для формы? Ссылка не открывается

[@alexantipin]

Здравствуйте, под видео есть ссылка на сайт и всё открывается, второй код для формы.

[@rilaxtime5587]

Если много кнопок на странице, делать код после каждого зеро?

[@alexantipin]

Добрый день. Нет, достаточно через запятую код каждой кнопки.

[@rilaxtime5587]

@@alexantipin спасибо

[@ЕкатеринаХрамова-щ3д]

Спасибо за видео! Подскажите, как применить этот эффект к нескольким кнопкам на странице?

[@alexantipin]

Добрый день. спасибо за комментарий, вот в этом видео вы найдёте ответ. kzbin.info/www/bejne/eIHHcphqo7x2q5o

[@Shakhnazarova_pro]

Как настроить, чтобы работало в адаптивах?

[@alexantipin]

Добрый день. Этот эффект применяется к кнопке в общем и работает на кнопке на всех адаптивах.

[@MrParkyr]

Окей, анимацию мы добавили, а как прикрутить еще и ссылку туда? ведь если вставить после шорткода ссылку, ничего не работает

[@alexantipin]

Я к сожалению не вижу что вы сделали, а гадать и переписываться мы можем долго, в Тильда можно ссылку поставить на любой объект, вот и поставьте на нужный. Если можете скиньте мне ссылку на то что у вас получилось, может я быстрее пойму что и как.

[@valeeekg]

а вторую кнопку через запятую можно добавить ? или как?

[@alexantipin]

да, как раз через запятую и добавляйте

[@ablaihan2930]

Алекс а вы сможете такой блик сделать на таплинке? Если да то снимите видео плиз...?

[@alexantipin]

К сожалению я с таплинком ещё не работал, по этому вряд ли я смогу вам помочь.

[@dariak8672]

Подскажите, что делать, если блик не доходит до конца и застывает?

[@alexantipin]

В строке где вы меняете id кнопки, есть цифры 140px и есть расстояние прохода блика.

[@dariak8672]

@@alexantipin спасибо, разобралась;)

[@safiullinram]

Спасибо. Подскажите пжл настроить время повтора анимации на этой кнопке? Уж очень долгая пауза получается между бликами

[@alexantipin]

Приветствую, приношу свои извинения за то что долго не отвечал на ваш вопрос. Ответ прост, в коде есть отвечающий за это стиль, вот как он выглядит. 3s это и есть 3 секунды, меняете на время которое вам подходит и всё. webkit-animation: moving 3s ease-in-out infinite; -moz-animation: moving 3s ease-in-out infinite; -ms-animation: moving 3s ease-in-out infinite; -o-animation: moving 3s ease-in-out infinite; animation: moving 3s ease-in-out infinite; Но менять нужно во всех полях.

[@alexantipin]

Добрый день. приношу свои извинения за поздний ответ, в конце этого видео вы найдёте ответ. kzbin.info/www/bejne/eIHHcphqo7x2q5o

[@arsenuim]

а если кнопка большая, то блик не во всю высоту...

[@alexantipin]

Там нужно по играть с цифрами во второй строке.

[@asselalmukhanova1534]

А если у меня несколько блоков с кнопками "Оставить заявку", то на каждый блок делать Т123 и ставить код?

[@alexantipin]

Не нужно новый код добавлять, нужно через запятую добавить код кнопки.

[@asselalmukhanova1534]

@@alexantipin т.е 2 кода кнопки внутри одного апострофа?

[@alexantipin]

@@asselalmukhanova1534 У вас примерно так должно получиться в коде где кнопки, это пример с 2-мя кнопками, но можно и больше $('#rec157934702 .tn-elem[data-elem-id="1580203032419"] .tn-atom , #rec157934702 .tn-elem[data-elem-id="1580197585238"] .tn-atom' )

[@Ruslansuper1991]

А задержки можно делать с помощью кода?

[@alexantipin]

В низу в коде есть одинаковые цифры, в вашем примере вроде 3. Вот их нужно поменять на то время что вам нужно, обязательно все.

[@Ruslansuper1991]

@@alexantipin Хорошо спасибо! Буду пробовать!

[@humpaedit]

Сделала все по инструкции, а кнопка просто увеличилась в размерах и при этом без анимации:(

[@alexantipin]

Здравствуйте, скорее всего вы могли допустить маленькую ошибку, попробуйте внимательно попробовать сделать ещё раз заново.

[@ОльгаЕфремова-ч6т]

@@alexantipin повторила все заново не один раз, кнопка увеличивается в размерах, а блик проходит один раз при загрузке страницы. что делаю не так?

[@darina4534]

Оля, была такая проблема у меня. Это все из-за браузера хром. Сделайте в другом браузере и все заработает.

[@АннаТраченко]

@@darina4534 у меня и во всех браузерах одно и то же

[@KitachiKitaru]

Апостроф называется ) а так спасибо )

[@meamade]

Тильда исправляет все кавычки на > и блик на кнопке не работает, как исправить?

[@alexantipin]

Не понимаю о чём вы, Тильда ни чего не исправляет и не несёт ни какой ответственности за сторонний код. Скорее всего вы что то упустили, так как все кнопки к которым я применял такие скрипты работают.

[@Артембобков-х4й]

Скажите, а как изменить длину анимации, у меня не на весь размер кнопки ?

[@Vladimir00505]

В коде кнопки размер поправить нужно

[@Expertdog]

ПОМОГИТЕ! у меня не получилось. дело в том, что у меня в ZERO блоке стоит не кнопка а форма. И когда я смотрю код элемента, то там кнопка + два поля ввода имя и телефон. Я скопировал и вставил как вы показали, но не сработало. В чем может быть дело? НО ВИДЕО КЛАССНОЕ я долго искал чтобы так объяснили и показали на пальцах RESPECT

[@alexantipin]

Добрый день! Попробуйте применить этот код (эффект блика 2) Если не получится, пишите постараюсь записать видео инструкцию) //Функция добавления эффекта function zeroformbtn(){ setTimeout(function() { //Прописываем скрипт эффекта $('.t-submit').addClass('autoflash').append(''); }, 1500);}; zeroformbtn(); var resizeTimeout; $(window).resize(function(){ clearTimeout(resizeTimeout); resizeTimeout = setTimeout(function(){ zeroformbtn(); }, 1500); }); .autoflash{ position: relative; overflow: hidden; } .flash{ content: ""; background-color: rgba(255, 255, 255, 0.5); height: 100%; width: 3em; display: block; position: absolute; top: 0; left: -4.5em; -webkit-transform: skewX(-45deg) translateX(0); transform: skewX(-45deg) translateX(0); -webkit-transition: none; transition: none; } .lighting { webkit-animation: moving 3s ease-in-out infinite; -moz-animation: moving 3s ease-in-out infinite; -ms-animation: moving 3s ease-in-out infinite; -o-animation: moving 3s ease-in-out infinite; animation: moving 3s ease-in-out infinite; } @keyframes moving { 30% { webkit-transform: skewX(-45deg) translateX(33.5em); transform: skewX(-45deg) translateX(33.5em); } 100% { webkit-transform: skewX(-45deg) translateX(33.5em); transform: skewX(-45deg) translateX(33.5em); } }

[@СветланаГамолина-е9щ]

@@alexantipin та же проблема( не получилось

[@alexantipin]

@@СветланаГамолина-е9щ Не понимаю что у вас может не получиться, там всего то нужно для кнопки заменить её код. Я к сожалению не могу увидеть как у вас всё сделано и не увижу из за чего у вас не получается

[@ВитаСеряк]

@@alexantipin у меня была та же проблема. Сделала, как вы сказали, если открывать на компе, то все ок, если в телефоне, то блика нет. Это можно исправить как-то?

[@alexantipin]

@@ВитаСеряк Добрый день! Оно не может работать на компе а в тел. нет, если только у вас разные кнопки в этих версиях сайта, по крайней мере я не сталкивался с такой проблемой, всегда работал эффект и на пк и на моб. если это ID одной и той же кнопки.

[@genieyprav]

Не работает ссылка на код

[@alexantipin]

Спасибо, код здесь copilp.ru/blik-battom Нажмите на кнопку и он откроется.

[@СветланаВласенко-ю3н]

Не работает :(

[@alexantipin]

Работает :)

[@rufatdzhabrailov]

Функция полезная, тема интересная, но как же ужасно вы преподносите это... Как будто только проснулись и под дулом пистолета заставляют это делать

[@alexantipin]

Вас ни кто не заставлял его смотреть, в ютубе полно других более интересных для вас видео :)

[@kristina.salakhova]

Спасибо!

[@ЛарисаБезрукова-т5с]

Спасибо, все получилось!

[@АлинаГончар-э1п]

Большое спасибо!

[@nataliabormotova]

Спасибо!!!

[@airmaxusov]

Спасибо большое!!!!!!

[@ИванВалерьев-б4и]

спасибо