Looks like does not work on WIX

[renanmalato]

Looks like does not work on WIX

[micku7zu]

It doesn't matter where you add it, it should work everywhere.

It depends how your elements are created in the page. If the elements are not present when the VanillaTilt.init function runs, then it won't initiated the script on those elements.

It is not enough to have the script at the end of the body, if the elements are not inside the body when the script is run.

Debugging through screenshots is not enough. Leave a URL and I might be able to help you.

[renanmalato]

Hey Mick, Thank you so much for your response. Happy New Year

Here is my test page
https://renan-stnl-uxdesign.com

There is a black box over a section, this container should be on Vanilla - at least on my last website not on wix I was able to do that

I appreciate any kind of advice you might have to me

[micku7zu]

Ok, at a quick look on this page, there are multiple issues:

1. The vanilla-tilt.js file is not loading correctly. The link you use it is not working as you expect, and it loads as 0bytes. So the library is not loaded. Change the github URL to some CDN. I don't know WIX, I never used WIX, so I don't know what methods you have to load a JS file, but the way you use it right now, it doesn't work.
   Screenshot
2. The JS code is at the beginning of , so if VanillaTilt.init executes at the beginning of when the elements are not on the page, it will not find any elements on the page and it will not apply the effect. You have to include this script at the end of the page, or to run it somehow AFTER the elements are on the page.
3. .cardglass, .creditcardglass - your element on the page doesn't have this classes. They are prefixed with wixui-
   Screenshot

If you fix this issues, the effect will work: Working effect (this was done in developer console, so it is not actually helping you fix the issues above)

[renanmalato]

Hi, I fixed the file KBs linking the script to a CDN as you can see in the Network console

and I also inserted the extended class call to the JS wixui-creditcardglass

if you have a moment to look the link one more time to see if I missed something I appreciate it, thank you

[micku7zu]

The <script> is still loaded at the start of the page, before the elements are inserted on the page. You have to include it at the end.

Or you can try this code:

document.addEventListener("DOMContentLoaded", function(event) {
  VanillaTilt.init(document.querySelectorAll(".cardglass, .creditcardglass, .wixui-creditcardglass"), {
    max: 25,
    speed: 400,
    glare: true,
    "max-glare": 1,
  });
});

[micku7zu]

I will close the issue as this is not related to the library. The library works, you have to include it correctly.

[renanmalato]

Still does not works :( $100 usd would you help me to include it correctly? Best regards,

…

___________________________________________________ RENAN MALATO UX DESIGNER & MULTIMEDIA SPECIALIST DESIGN.RENANMALATO.COM

On Mon, Jan 1, 2024 at 12:51 PM Șandor Sergiu ***@***.***> wrote: Closed #133 <#133> as completed. — Reply to this email directly, view it on GitHub <#133 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AA3TCLSNLVPTMJVBBHWL45LYMLZTFAVCNFSM6AAAAABBIO5F76VHI2DSMVQWIX3LMV45UABCJFZXG5LFIV3GK3TUJZXXI2LGNFRWC5DJN5XDWMJRGM3DKNZSGI3TEMQ> . You are receiving this because you authored the thread.Message ID: ***@***.***>

[micku7zu]

Hi, Send me a meeting link, discord or something and I can help you.

[renanmalato]

Meeting link: https://meet.google.com/mtx-rkda-cyq I will give you a team viewer ID on the chat On Mon, Jan 1, 2024 at 1:28 PM Șandor Sergiu ***@***.***> wrote:

…

Hi, Send me a meeting link, discord or something and I can help you. On Mon, Jan 1, 2024, 20:10 renanmalato ***@***.***> wrote: > Still does not works :( > > $100 usd would you help me to include it correctly? > > > > Best regards, > > > > ___________________________________________________ > > > > > > > > > > RENAN MALATO > > UX DESIGNER & MULTIMEDIA > > SPECIALIST > > > DESIGN.RENANMALATO.COM > > > > > > > > > > On Mon, Jan 1, 2024 at 12:51 PM Șandor Sergiu ***@***.***> > wrote: > > > Closed #133 <#133> as > > completed. > > > > — > > Reply to this email directly, view it on GitHub > > < > #133 (comment)>, > > > or unsubscribe > > < > https://github.com/notifications/unsubscribe-auth/AA3TCLSNLVPTMJVBBHWL45LYMLZTFAVCNFSM6AAAAABBIO5F76VHI2DSMVQWIX3LMV45UABCJFZXG5LFIV3GK3TUJZXXI2LGNFRWC5DJN5XDWMJRGM3DKNZSGI3TEMQ> > > > . > > You are receiving this because you authored the thread.Message ID: > > ***@***.***> > > > > — > Reply to this email directly, view it on GitHub > < #133 (comment)>, > or unsubscribe > < https://github.com/notifications/unsubscribe-auth/AAXVY4Z3DMCFSGMDS2ZZCITYML32RAVCNFSM6AAAAABBIO5F76VHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMYTQNZTGQZDIMRTGA> > . > You are receiving this because you modified the open/close state.Message > ID: ***@***.***> > — Reply to this email directly, view it on GitHub <#133 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AA3TCLVX5W5IBCHO3PPFN53YML55PAVCNFSM6AAAAABBIO5F76VHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMYTQNZTGQZDSOBUGM> . You are receiving this because you authored the thread.Message ID: ***@***.***>

[renanmalato]

Thank you so much for your hack man, Let me know if you received the PayPal... not sure if it completed

…

On Mon, Jan 1, 2024 at 1:38 PM Renan Malato ***@***.***> wrote: Meeting link: https://meet.google.com/mtx-rkda-cyq I will give you a team viewer ID on the chat On Mon, Jan 1, 2024 at 1:28 PM Șandor Sergiu ***@***.***> wrote: > Hi, > > Send me a meeting link, discord or something and I can help you. > > > > On Mon, Jan 1, 2024, 20:10 renanmalato ***@***.***> wrote: > > > Still does not works :( > > > > $100 usd would you help me to include it correctly? > > > > > > > > Best regards, > > > > > > > > ___________________________________________________ > > > > > > > > > > > > > > > > > > > > RENAN MALATO > > > > UX DESIGNER & MULTIMEDIA > > > > SPECIALIST > > > > > > DESIGN.RENANMALATO.COM > > > > > > > > > > > > > > > > > > > > On Mon, Jan 1, 2024 at 12:51 PM Șandor Sergiu ***@***.***> > > wrote: > > > > > Closed #133 <#133> > as > > > completed. > > > > > > — > > > Reply to this email directly, view it on GitHub > > > < > > > #133 (comment)>, > > > > > > or unsubscribe > > > < > > > https://github.com/notifications/unsubscribe-auth/AA3TCLSNLVPTMJVBBHWL45LYMLZTFAVCNFSM6AAAAABBIO5F76VHI2DSMVQWIX3LMV45UABCJFZXG5LFIV3GK3TUJZXXI2LGNFRWC5DJN5XDWMJRGM3DKNZSGI3TEMQ> > > > > > > . > > > You are receiving this because you authored the thread.Message ID: > > > ***@***.***> > > > > > > > — > > Reply to this email directly, view it on GitHub > > < > #133 (comment)>, > > > or unsubscribe > > < > https://github.com/notifications/unsubscribe-auth/AAXVY4Z3DMCFSGMDS2ZZCITYML32RAVCNFSM6AAAAABBIO5F76VHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMYTQNZTGQZDIMRTGA> > > > . > > You are receiving this because you modified the open/close > state.Message > > ID: ***@***.***> > > > > — > Reply to this email directly, view it on GitHub > <#133 (comment)>, > or unsubscribe > <https://github.com/notifications/unsubscribe-auth/AA3TCLVX5W5IBCHO3PPFN53YML55PAVCNFSM6AAAAABBIO5F76VHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMYTQNZTGQZDSOBUGM> > . > You are receiving this because you authored the thread.Message ID: > ***@***.***> >

[renanmalato]

I believe now it went,
should be available tomorrow
let me know if all good

email: [email protected]

[micku7zu]

Thanks! I've got them. First donation/money related to vanilla-tilt.js in 8 years, after 3.7k Github stars and 2m downloads on NPM.