JQuery library versions

The library included in Pinegrow is 1.11. Is it possible for me to include the latest v. 3.11
without them both colliding. Even better perhaps just go with the latest one instead?

If not, please explain why.
Thank you for your time.

You could right click > edit code and swap out the reference in the page to a newer CDN version? But yeah good question why it’s using the way old version 1.11.1 @matjaz ? For security and performance, it’s suggested to always use the latest when possible.

Unless I am miss thinking another way in app to approach and change this?

I can confirm that at least isotope in js/bskit-scripts.js doesn’t work if 1.11.1 isn’t included.
I would update the isotope script myself, but I’m not that good at understanding js.

The Pinegrow Bootstrap Blocks are from “BootStrap Starter Kit” which seem to be quite dated concerning the libraries and plugins used. Even their own website demo on their site uses “jquery-1.11.1”, and I don’t see any updates or references to newer versions?

Anyway, in the “plugins.js” file towards the bottom you will see “Isotope v1.5.25” from 2013, you can try updating that section and replacing it with a newer version. That would however assume none of the syntax or calls changed and it would be a clean crossover, otherwise you would have to chase down all references and such to change them accordingly as needed for whatever changed across versions.

Let us know if you try and it works.

Hope these are things that will be adressed in the next big update.

Anyways, thanks for your tip! However I found out that there’s a way to migrate.
https://github.com/jquery/jquery-migrate/#readme

So I went like this:

<script type="text/javascript" src="js/jquery-3.1.1.min.js"></script>
      <script type="text/javascript" src="js/jquery-migrate-3.0.0.min.js"></script>
      <script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>

so now they both work. I didn’t quite grasp if I was supposed to include the 1.11.1 beneath the jquery-migrate.js or not, but it seems to work with it so I didn’t bother to try otherwise.

I was gonna suggest that as well, but then you are loading two versions of the library + the migrate. But it does offer a quick resolution, and if it works for you in the meantime and your happy then, I guess that works.

Hard to say regarding the next version, given the creator of the Starter Kit has yet to update as well. :wink:

PS: I believe the original is to be first and the migration is supposed to come after?

Thanks! :slight_smile:

Off Topic:
I’m guessing that you’re familiar with jquery as well, and if you are in the mood to give me some tips - I have a question!

Let’s say I’m making

¤ Big grid or inline row of boxes. There’s going to be a TON of boxes.
¤ Some boxes have very little information and will fit inside a ‘normal-box’.
¤ Other ‘special-box’ named items needs to expand to show all content.

Problem: how can I in the simplest way make so that when I click one
‘special-box’, all other boxes with the ‘special-box’ class doesn’t open
as well?

My code as of now is very simple.

 $(document).ready(function(){
       $(".special-card").click(function(){
       $(".special-card").toggleClass("expanded").css({"align-self":"flex-start!important","text-decoration":"none"});
             $(".special-card")(function(){
             $(".scroller").css({"align-items":"flex-end"});
   });
  });
});

Hi @CIPHER2K, I’m very new to javascript, and so this may be a dumb answer, but I guess you would need to use the

specialBox= document.getElementById(‘box_number_x’);

where each one of your Tons of boxes is allocated its own # ID in the HTML.
and then do your magic on that one box.

If I’m wrong, good, I hope to learn how as well then :slight_smile: