Conflict with no-js and an App that uses JQuery

[mike_boyd]

Hi everyone,

I'm using the Prestige theme which from what I can see uses a "no-js" class in the CSS to hide certain functions on the theme - especially in the product-form.liquid Snippet that makes up the Product page. I'm also using the Globo Request a Quote App which requires the addition of the following JQuery code to the theme.liquid file to work:

<script src=”https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js”></script>

How do I have both the "no-js" class and the JQuery active at the same time? Any advice/code on living with both options very much appreciated.

Cheers,

Mike

[gina-gregory]

The 'no-js' class is just a fallback to hide certain elements that require JS to function if the browser does not have JS enabled. You can include jQuery without a conflict. Just know that anybody browsing without JS enabled won't be able to use that feature.

[mike_boyd]

Hi Gina,

Thanks for coming back to me. The issue is that when I include the JQuery <script> the App does not work until I remove the class="no-js" from the theme.liquid file. Am I doing something wrong?

Cheers,

Mike

[gina-gregory]

I'm not sure what the issue is with the app. The theme itself should be removing the 'no-js' class and replacing it with a 'js' class. Is this not happening in your theme? Can you provide a URL I can look at?

[mike_boyd]

Here's a link to a product where the Add To Quote app should be working:

https://dev.theclassicoutfitter.com/collections/outdoor-sofas/products/walter-sofa

Let me know what you see? Add to Cart or Add to Quote?