Question

我正在尝试使用wordpress上的js / jquery动态设置列元素的宽度。我采用这种方法是因为我的主题是劫持我的CSS并且我经历了前所未有的顽固性。

这是我的代码，我知道100％jquery正在加载并且javascript执行（通过发出警报和测试等），所有帮助都赞赏！

我的HTML是

<div class="3-col-force">test</div>
<div class="3-col-force">test</div>
<div class="3-col-force">test</div>

<script type="text/javascript">

window.onload = fixCol();
window.onresize = fixCol();
function fixCol(){  
    var offset = getWidth();
    if (offset > 765) {
        setColumnWidth('33%');
    } else {
        setColumnWidth('100%'); 
    }
}
function setColumnWidth(newWidth){
    var columns = document.querySelector(".3-col-force");
        columns.style.width = newWidth;
}
function getWidth() {
  var width = $(window).width(); 
  return width;
}
</script>

Answer 1

如果您打算使用JQuery，我建议使用以下代码。我相信这是您尝试使用代码完成的任务。

jsfiddle示例：http://jsfiddle.net/larryjoelane/bazma5st/29/

的Javascript / Jquery的：

//set the limit
var limit = 765;

//the column class
var colClass = $(".3-col-force");

//window resize event
$(window).on("resize",function(){//begin on resize event

  //if the window is greater than the limit
  if ($(this).width() > limit) {//begin if then else

      //set its width to 33%
      colClass.width("33%");

    } else {

        //set its width to 33%
        colClass.width("100%");

    }//end if then else

//end of window on resize event
}).on("load",function(){//begin on load event for window load

    //if the window is greater than the limit
  if ($(this).width() > limit) {//begin if then else

      //set its width to 33%
      colClass.width("33%");

    } else {

        //set its width to 33%
        colClass.width("100%");

    }//end if then else


});//end on window load event

在窗口加载或调整大小 - 设置元素属性JS。无法找到错误

1 个答案: