Question

我有这个页面：

link

我把照片更好地理解他们想做什么。

http://i58.tinypic.com/2vi4cwi.jpg

我的边距取决于宽度边缘元素"#secondary".

如果边缘必须具有特定值，则该元素的宽度为260px。

如果您调整窗口边缘的大小是平滑的，只能观看节目。

http://i61.tinypic.com/fk4s46.png

CODE CSS：

#secondary{
    float: left;
    width: 20.4%; 
    position:fixed;
    top:0;
    background:url(images/BODY-MENU.png);
    height:100vh;
    max-width:260px;
    background-size:cover;
}

CODE JS：

jQuery(document).ready(function ($) {

   var width = jQuery('#secondary').width();

$('.navbar-fixed-top').css('margin-left', width);
});

我尝试更新margin-left以上的代码，具体取决于必须始终保持在我的元素的相同位置。

你能告诉我一个如何解决这个问题的想法吗？

提前致谢！

Answer 1

你需要使用.resize（）;

$(window).on('resize',function(){
   var width = jQuery('#secondary').width();
   $('.navbar-fixed-top').css('margin-left', width+'px'); // use px
});

您可以使用if(width < 260){}

之类的if语句

这就是你要找的东西？

$(document).ready(function(){
 var changemargin = function(){
   var width = jQuery('#secondary').width();
   $('.navbar-fixed-top').css('margin-left', width+'px'); // use px
 }
 // run function here 
 changemargin();
 // run it again on resize
 $(window).on('resize',changemargin);
});

如何使响应式JQuery保留余量？

1 个答案: