获取窗口大小调整函数的值，并将其放入另一个函数中

get value of window resize function and take it in another function

本文关键字：函数 另一个 调整 窗口大小 获取      更新时间：2023-09-26

以下情况：

var height = $(window).height();
$(window).resize(function() {
var getfactor1 = 680 / 697
var posval1 = height*getfactor1
});

在另一个函数中，我有以下内容：

if($firstBG.hasClass("inview")){
$firstBG.css({'backgroundPosition': newPos(0, windowHeight, pos, posval1, 0.3)});   
    }

每次用户缩放浏览器窗口时，我如何将window.resize（）函数中的posval1值获取到firstBG.css中。

谢谢！！

或者您可以尝试通过一个函数传递它：

var height = $(window).height();
 $(window).resize(function() {
 var getfactor1 = 680 / 697
 var posval1 = height*getfactor1
 myFunction(posval1);
});
 function myFunction(posval1){
  if($firstBG.hasClass("inview")){
   $firstBG.css({'backgroundPosition': newPos(0, windowHeight, pos, posval1, 0.3)});   
  }
 }

或者，更简单地说，为什么不在windows resize函数之外声明posval1？

var height = $(window).height(),
    posval1;
$(window).resize(function() {
   var getfactor1 = 680 / 697;
   posval1 = height*getfactor1;
});
if($firstBG.hasClass("inview")){
    $firstBG.css({'backgroundPosition': newPos(0, windowHeight, pos, posval1, 0.3)});   
}

为什么不将$firstBG.css（）放入window.resize（）中？

每次用户调整窗口大小时都会发生调整大小事件。如果要更改某些内容，则必须通过该事件的处理程序进行更改，否则值将不会更新。但通常情况下，如果posval1变量的作用域高于resize事件处理程序，那么您也可以从其他地方访问它，但正如我所说，除非在事件处理程序中，否则代码的其他部分不会再次执行。

范围示例：

var posval1;
$(window).on('resize', function() {
  posval1 = height * (680 / 697);
});
// somewhere else
console.log(posval1);

然而，在执行到达console.log()时，posval1的值很可能是未定义的，因为窗口尚未调整大小。所能做的只是将CSS更新外包给另一个函数，并从事件处理程序中调用它，一开始也调用一次。

var windowHeight, pos, posval1; // etc
var updateBg = function () {
  if($firstBG.hasClass("inview")){
    $firstBG.css({'backgroundPosition': newPos(0, windowHeight, pos, posval1, 0.3)});   
  }
};
updateBg(); // once
$(window).on('resize', function () {
  // calculate posval1
  updateBg(); // every time on resize
});

function newPos(x, windowHeight, pos, adjuster, inertia){
    return x + "% " + (-((windowHeight + pos) - adjuster) * inertia)  + "px";
}

function Move(){ 
    var pos = $window.scrollTop(); 

    if($firstBG.hasClass("inview")){
         var getfactor1 = 680/697;
        var posval1 = height*getfactor1;
        console.log(posval1);
        $firstBG.css({'backgroundPosition': newPos(0, windowHeight, pos, posval1, 0.3)});   
    }

    if($secondBG.hasClass("inview")){   
        var getfactor2 = 1255/697;
        var posval2 = height*getfactor2;

依此类推

相关文章：