必须刷新才能运行功能答案

【问题标题】：have to refresh to run function必须刷新才能运行功能
【发布时间】：2015-06-29 14:00:00
【问题描述】：

我正在尝试为我的投资组合网站创建一个响应式缩略图库。 .gallerythumb 是拇指，它的默认宽度是 25%。理论上，我的 jquery 将根据页面大小调整缩略图 div 容器的宽度。它可以工作，但 if/else 语句仅在页面加载时运行，这意味着我必须在调整浏览器大小后刷新页面才能运行。有什么线索吗？

    if ($(window).width() < 640) {
   $(".gallerythumb").css("width", "50%");
}
else if ($(window).width() < 260) {
   $(".gallerythumb").css("width", "100%");
  }

【问题讨论】：

看看api.jquery.com/resize

标签： javascript jquery css responsive-design

【解决方案1】：

您可以在一个函数中移动您的画廊调整大小代码，然后在窗口调整大小以及窗口加载时调用该函数

function resizeGallery() {
   if ($(window).width() < 640) {
       $(".gallerythumb").css("width", "50%");
   }
   else if ($(window).width() < 260) {
       $(".gallerythumb").css("width", "100%");
   }
}

$(window).resize(function () {
    resizeGallery();
});

$(document).ready(function() {
    resizeGallery();
})

【讨论】：