【问题标题】:Does jQuery limit the value greater than statements?jQuery 是否限制大于语句的值?
【发布时间】:2018-08-03 18:42:09
【问题描述】:

我正在尝试制作一个使用导航按钮切换到不同 16:9 部分的滚动图像。一切正常,除了 jQuery 似乎将 if(igBase.css('left') > igMaxLeft) 限制为 -1200 像素或更高,即使 igMaxLeft 是例如 -2600 像素。这种行为有什么原因吗?数学对我来说是正确的。

    var igWrap = $('.infographic-wrapper');
    var igBase = $('.infographic-base');
    var igPrev = $('.infographic-previous');
    var igNext = $('.infographic-next');
    var igFrameWidth = igWrap.css('width');
    var igMaxLeft = parseInt(igBase.css('width'), 10) + parseInt(igFrameWidth, 10);
    igMaxLeft = '-' + igMaxLeft + 'px';

    igPrev.click(function(){
        if(igBase.css('left') < '0px'){
            igBase.css('left','+=' + igFrameWidth);
        }
    });
    igNext.click(function(){
        if(igBase.css('left') > igMaxLeft){
            igBase.css('left','-=' + igFrameWidth);
        }
    });

以下是完整示例:https://codepen.io/arinthros/pen/YejRey

【问题讨论】:

  • strings&lt;&gt; 运算符与 numbers 不同(因为 &lt;/&gt; 使用字符串使用 Lexical-aka-字典排序)。例如,这些是“假”:"-200px" &lt; -100"-200px" &lt; "-100px"。修复:使用带有 &lt;/&gt; 的数字进行正确的数字排序。
  • 谢谢,我会把字符串转换成整数。

标签: javascript jquery


【解决方案1】:

将 css 像素字符串转换为整数解决了这个问题。感谢 user2864740 的提示。

    var igMaxLeft = (parseInt(igBase.css('width'), 10) - parseInt(igFrameWidth, 10)) * -1;

    igPrev.click(function(){
        if(parseInt(igBase.css('left'), 10) < 0){
            igBase.css('left','+=' + igFrameWidth);
        }
    });
    igNext.click(function(){
        if( 0 >= parseInt(igBase.css('left'), 10) && parseInt(igBase.css('left'), 10) > igMaxLeft){
            igBase.css('left','-=' + igFrameWidth);
        }
    });

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2014-10-01
    • 2014-02-28
    • 2011-09-07
    • 1970-01-01
    • 2015-10-10
    • 1970-01-01
    • 2018-05-29
    相关资源
    最近更新 更多