javascript - 如何使用 jquery 重绘 div（webflow 自定义代码）

Question

我正在尝试创建一个由 jquery 激活的模式。在该模式中，我在 webflow 中创建了一个滑块，但该滑块不起作用。webflow 支持建议在模态激活器之后插入这行代码：Webflow.require('slider').redraw();

但它不起作用。

这是我的代码：

$('#plus-1').on('click', function() {

    //apri la modal corrispondente
    $("#modal-1").css('display', 'flex');
    //$('.slider').redraw();
    Webflow.require('slider').redraw();

     $('#chiudi-1').on('click', function() {
    //chiudi la modal corrispondente
    $("#modal-1").css('display', 'none');
});});

<script src="https://www.tecmasolutions.com/clients/princype-2/js/configurator-princype-rev002.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <link href="https://www.tecmasolutions.com/clients/princype-2/css/normalize.css" rel="stylesheet" type="text/css">
  <link href="https://www.tecmasolutions.com/clients/princype-2/css/components.css" rel="stylesheet" type="text/css">
  <link href="https://www.tecmasolutions.com/clients/princype-2/css/configurator-princype-rev002.css" rel="stylesheet" type="text/css">
  
  
<button id="plus-1" type="button">Click Me!</button>
  

<div id="modal-1" class="modal-prezzi porta-h240 logged">
    <div class="info-wrapper-checkout logged">
    <a id="chiudi-1" class="chiudi checkout logged">x</a>
      <div id="slider-1" class="slider w-slider">
        <div class="w-slider-mask">
          <div class="img_int-pack-premium-plus a w-slide">
          </div>
          <div class="img_int-pack-premium-plus b w-slide">
          </div>
          <div class="img_int-pack-premium-plus c w-slide">
          </div>   
        </div>
        <div class="w-slider-arrow-left">
          <div class="icon-2 w-icon-slider-left"></div>
        </div>
        <div class="w-slider-arrow-right">
          <div class="icon-3 w-icon-slider-right"></div>
        </div>
        <div class="slide-nav w-slider-nav w-round"></div>
      </div>
    </div>
  </div>

Answer 1

我找到了缺失的地方。在Webflow.require('slider').redraw();我不得不放这个之前：

$.fn.redraw = function(){
  $(this).each(function(){
    var redraw = this.offsetHeight;
  });
};