超出范围使用的变量 [英] variable used out of scope

问题描述

我正在制作响应式背景视频.我有这段代码.

I'm doing a responsive background video. I have this code.

<video id="bgvideo" />

function scaleVideo() {

    var windowHeight = $(window).height();
    var windowWidth = $(window).width();

    var videoNativeWidth = $('video#bgvideo')[0].videoWidth;
    var videoNativeHeight = $('video#bgvideo')[0].videoHeight;


    var heightScaleFactor = windowHeight / videoNativeHeight;
    var widthScaleFactor = windowWidth / videoNativeWidth;


    if (widthScaleFactor >= heightScaleFactor) {
        var scale = widthScaleFactor;
    } else {
        var scale = heightScaleFactor;
    }

    var scaledVideoHeight = videoNativeHeight * scale;
    var scaledVideoWidth  = videoNativeWidth * scale;

    $('video#bgvideo').height(scaledVideoHeight);
    $('video#bgvideo').width(scaledVideoWidth);
}

我正在使用grunt编译我的代码等. Jshint咕gr咕saying地说我正在使用"scale"(超出范围)，我不明白为什么.

I'm using grunt to compile my code and etc. Jshint of grunt is saying I'm using "scale" out of scope and I cant understand why.

有人建议吗?

推荐答案

尝试以下方法:

function scaleVideo() {
    var scale; //this is the change

    var windowHeight = $(window).height();
    var windowWidth = $(window).width();

    var videoNativeWidth = $('video#bgvideo')[0].videoWidth;
    var videoNativeHeight = $('video#bgvideo')[0].videoHeight;


    var heightScaleFactor = windowHeight / videoNativeHeight;
    var widthScaleFactor = windowWidth / videoNativeWidth;


    if (widthScaleFactor >= heightScaleFactor) {
        scale = widthScaleFactor; //simply modify the value here
    } else {
        scale = heightScaleFactor;
    }

    var scaledVideoHeight = videoNativeHeight * scale;
    var scaledVideoWidth  = videoNativeWidth * scale;

    $('video#bgvideo').height(scaledVideoHeight);
    $('video#bgvideo').width(scaledVideoWidth);
}

这篇关于超出范围使用的变量的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！