2014-11-05 138 views
0

我想使用angularjs指令将绝对div的右侧与另一个div的右侧对齐。代码几乎可以正常工作,但子divs比父宽度稍宽,我得到的offsetWidth值是错误的。使用angularjs指令将绝对div与其他div的右边缘对齐

jsfiddle

我的指令:

app.directive('alignElementRight', function ($document) { 
return { 
    restrict: 'A', 
    scope: { 
     alignElementRight: '@' 
    }, 
    link: function (scope, element, attrs) { 
     scope.$watch('alignElementRight', function (value) { 
      console.log(value); 

      var relEleme = $document.find('#' + value); 
      var myEl = angular.element(document.querySelector('#' + value)); 
      var elOffsetLeft = myEl[0].offsetLeft; 
      var elOffsetTop = myEl[0].offsetTop; 
      var elOffsetWidth = myEl[0].offsetWidth; 

      console.log('main width:' + elOffsetWidth); 

      var absElemOffsetWidth = element[0].offsetWidth; 
      console.log('menu: ' + absElemOffsetWidth); 

      var newOffsetLeft = Math.abs(elOffsetLeft + elOffsetWidth - absElemOffsetWidth); 
      element.css({ 
       left: newOffsetLeft + 'px' 
      }); 
     }); 


    } 
}; 

});

回答

0

最简单的解决将是对.row元素重新引导的负页边距设置,因为那是什么导致所有的烂摊子(你计算好,否则):

.row { 
    margin: 0; 
} 

见这里:http://jsfiddle.net/9d8gq8r2/4/