Переменная Javascript не работает. Зачем?

Question

Я не понимаю что-то о переменных в JavaScript. Я пытаюсь изменить / вычислить «смещение» (с переменной «theOffset») либо до того, как произойдет функция localScroll, либо, более предпочтительно, при изменении размера окна. Ни один из приведенных ниже примеров не работает, примите "// инициализировать смещение".

Как мне изменить переменную "theOffset" внутри "$ .localScroll"?

jQuery(function( $ ){

    //initialize offset
    var windowWidth = $(window).width();
    if (windowWidth < 900) {
        theOffset = 0;
    } else {
        theOffset = ($(window).width() - 900) / -2;
    }

$(window).resize(function() {
    //calculate offset
    var windowWidth = $(window).width();
    if (windowWidth < 900) {
        theOffset = 0;
    } else {
        theOffset = ($(window).width() - 900) / -2;
    }
});


    $.localScroll({
        target: '#content',
        queue:true,
        duration:1500,
        hash:true,
        stop:true,
        onBefore:function( e, anchor, $target ){
            //calculate offset
            var windowWidth = $(window).width();
            if (windowWidth < 900) {
                theOffset = 0;
            } else {
                theOffset = ($(window).width() - 900) / -2;
            }
        },
        offset: {top:0, left: theOffset,
        onAfter:function( anchor, settings ){
            if (windowWidth < 900) {
                theOffset = 0;
            } else {
                theOffset = ($(window).width() - 900) / -2;
            }
        }   
    });
});

Если нужно знать, я центрирую контейнер div в окне со смещением на необычном веб-сайте с прокруткой;)

Answer 1

Вы можете объявить объект myOffset, который будет передан по ссылке на offset: Вы также можете уточнить почти четырехкратную функцию в одну именованную функцию:

var myOffset = {top: 0, left: theOffset};
function calcOffset() {
  var windowWidth = $(window).width();
  if (windowWidth < 900) {
    myOffset.left = 0;
  } else {
    myOffset.left = (windowWidth - 900) / -2;
  }
}
calcOffset();
// note leaving off the () will pass the function as a parameter instead of calling it
$(window).resize(calcOffset);

$.localScroll({
    target: '#content',
    queue: true,
    duration: 1500,
    hash: true,
    stop: true,
    onBefore: calcOffset,
    offset: myOffset,
    onAfter: calcOffset
});

Answer 2

Обратите внимание, что в приведенном выше примере, если вы снова вызовете setupSomeGlobals(), будет создано новое замыкание (stack-frame!). Старые переменные gLogNumber, gIncreaseNumber, gSetNumber перезаписываются новыми функциями с новым замыканием. (В JavaScript всякий раз, когда вы объявляете функцию внутри другой функции, внутренняя функция (и) воссоздается / воссоздается снова при каждом вызове внешней функции.)

Answer 3

Я думаю, что ваша проблема здесь:

offset: {top:0, left: theOffset,

Во-первых, вам не хватает трейлинга}.

Во-вторых, вы делаете то, что называется «передачей по значению» - значение, которое отправляется при вызове $ .localscroll (), фактически является копией значения, указанного в theOffset.

Какую версию localScroll вы используете? Я скачал последний источник, который смог найти, который был 1.2.7, и нигде ничего не вижу о смещении.

Нет непосредственного способа решить вашу проблему, не увидев источник localScroll. Иногда авторы таких плагинов jQuery предоставляют средства для обновления параметров. Если это не так, вам, возможно, придется изменить источник localScroll, чтобы получить значение смещения посредством обратного вызова функции, а не через свойство объекта:

offset: {top:0, left: function() { return theOffset; } }

Обратите внимание, что вышеописанное не будет работать без изменения источника localScroll для получения этих данных через вызов функции вместо свойства options.

Answer 4

объявляет theOffset вне функции jquery

var theOffset = 0;

jquery( function ( $ ) {
} )