Skip Navigation

[Resolved] Java Script integration

This support ticket is created 6 years, 9 months ago. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

This topic contains 1 reply, has 1 voice.

Last updated by manuelE 6 years, 9 months ago.

Author
Posts
#546356

I am trying to:

... I´m currently building a site, based on a Toolset Child Theme, I build it with Layouts.

Now I would like to use a short JS-script to line up the height of different elements in one row.
(I´ve used this script on other sites already and it was always working perfectly)

--------------------------------------

I visited this URL:
https://toolset.com/forums/topic/where-to-put-custom-javascript-function/
https://toolset.com/documentation/user-guides/adding-custom-javascript-views/

--------------------------------------

I expected to see:
something like:
hidden link

--------------------------------------

Instead, I got:
my testpage:
hidden link
(These both div´s would have the same height if the script would work properly.)

--------------------------------------

So, it seems that if I put the script into this site, it somehow does not work.

The script itself is:

equalheight = function(container){

var currentTallest = 0,
     currentRowStart = 0,
     rowDivs = new Array(),
     $el,
     topPosition = 0;
 jQuery(container).each(function() {

   $el = jQuery(this);
   jQuery($el).height('auto')
   topPostion = $el.position().top;

   if (currentRowStart != topPostion) {
     for (currentDiv = 0 ; currentDiv < rowDivs.length ; currentDiv++) {
       rowDivs[currentDiv].height(currentTallest);
     }
     rowDivs.length = 0; // empty the array
     currentRowStart = topPostion;
     currentTallest = $el.height();
     rowDivs.push($el);
   } else {
     rowDivs.push($el);
     currentTallest = (currentTallest < $el.height()) ? ($el.height()) : (currentTallest);
  }
   for (currentDiv = 0 ; currentDiv < rowDivs.length ; currentDiv++) {
     rowDivs[currentDiv].height(currentTallest);
   }
 });
}

jQuery(window).load(function() {
  equalheight('.equalheight');
});

jQuery(window).resize(function(){
  equalheight('.equalheight');
});

I have the script within a Content Template´s JS section and load this in the Footer of the Site.
(this way the script loads at the very end of the page – and jquery is loading in the header – so this should be fine).

But it does not what it should do! ????
(something at least the script is doing – it ads a height-style to the elements but it seems that it does not execute „the whole thing“)

If I recreate the scenario outside of this page it works – so there must be a conflict, maybe in combination Toolset/Layouts?, which is causing this behaviour.

Do you have any idea where I can start searching for the problem? ????

Many thanks!!!
Manuel

#546376

Hi there,

just found out that it´s an CSS-issue, not related to the JS or Layouts. 🙂

Thanks anyway!
Manuel

This ticket is now closed. If you're a WPML client and need related help, please open a new support ticket.