jquery - Flexslider 'smoothHeight' 调整窗口大小时出现问题?

标签 jquery

我已经成功地让我的 flexslider 使用 smoothHeight 属性根据高度调整幻灯片的大小。我在让它工作时遇到了麻烦,但在网上研究后发现将函数包装在 $(window).load 中可以让它工作。

我已将其设置为仅在窗口宽度小于 769px 时才会发生。

我现在的问题是该功能仅在页面加载时才起作用。如果窗口从桌面向下调整大小,则不起作用。我有什么想法可以让它发挥作用吗?

 if ($slider.length) {
   if ($(window).width() > 769) {
     $(document).ready(function() {
       $slider.flexslider({
         animation: 'fade',
         animationSpeed: 500,
         pauseOnHover: false,
         keyboard: true,
         touch: true,
         controlNav: false,
         directionNav: {{ settings.slider_home_arrows }},
         slideshow: {{ settings.slider_home_auto }},
         slideshowSpeed: {{ settings.slider_home_rate }}
       });
     });  
   } else {
     $(window).load(function() {
       $slider.flexslider({
         animation: 'fade',
         animationSpeed: 500,
         smoothHeight: true,
         pauseOnHover: false,
         keyboard: true,
         touch: true,
         controlNav: false,
         directionNav: {{ settings.slider_home_arrows }},
         slideshow: {{ settings.slider_home_auto }},
         slideshowSpeed: {{ settings.slider_home_rate }}
       });
     });
   }
 };

最佳答案

在CSS中设置 slider 高度:100vh

关于jquery - Flexslider 'smoothHeight' 调整窗口大小时出现问题?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31748952/

相关文章:

jquery - 无法删除 on() 上的事件;

jquery - 使用 Meteor、jQuery 和 AWS SDK 将浏览器直接上传到 S3

javascript - 当通过 innerHTML 添加 html 内容时,Popover 不显示

jquery - 添加到 HTML 时 SVG 不显示

jquery - 在nodeJS中使用爬虫并没有给我任何结果,但是当我在浏览器中尝试相同的代码时,它给出了。我的代码有什么问题吗?

javascript - 如何替换 li 文本但保留其子元素?

javascript - jQuery 自动完成 : How to obtain HTML item's "id" attribute?

javascript - jQuery 输入[名称 =""] 选择器不起作用

javascript - Jquery Ajax表单没有成功消息

javascript - 如何根据地址动态 `generate` 谷歌地图?