首页 > 解决方案 > 在 Wordpress 中运行 jQuery Functions Document Ready & Window Resize

问题描述

我目前有一个工作脚本可以根据 WordPress 中 (document).ready 上的最大尺寸来调整一些 div 的大小。我还想在调整窗口大小时合并,它应该触发相同的功能。我在尝试添加 (window).resize 时遇到了很多麻烦 - 我尝试将它们组合起来,创建一个外部函数,甚至只是复制和粘贴相同的函数(但使用窗口调整大小而不是准备好文档作为触发器)。没有骰子...任何有关如何在 WP 中组合这两个触发器的帮助将不胜感激!

我为 Document Ready 准备的工作代码:

jQuery(document).ready(function($){

$('.service-row').each(function() {
  var highestBox = 0;

$('.service-item', this).each(function() {
  if ($(this).height() > highestBox) {
    highestBox = $(this).height();
  }
});

$('.service-item', this).height(highestBox);
        });

});

标签: jquerywordpresswindow-resize

解决方案


一种方法是将该代码包装在调整大小处理程序中,并在页面加载时触发调整大小事件以导致初始运行

jQuery(document).ready(function($) {

  $(window).on('resize', function() {
    $('.service-row').each(function() {
      var highestBox = 0;

      $('.service-item', this).each(function() {
        if ($(this).height() > highestBox) {
          highestBox = $(this).height();
        }
      });

      $('.service-item', this).height(highestBox);
    });
  // trigger resize on page load
  }).resize()


});

推荐阅读