如何在元素之间绑定css属性?

时间:2015-06-02 10:37:24

标签: javascript css angularjs

我希望元素A具有与元素B相同的宽度。每当B改变时,A也应该改变。

angularjs的做法是什么?

这是一个解释我的问题的小提琴: http://jsfiddle.net/ADukg/6684/

<?php
ini_set("session.cookie_lifetime", "0");
ini_set("session.gc_maxlifetime", "3600");
session_start();
include('Authorise.php');
echo "<center><h2>This site requires authentication.</h2>";
echo "<br><hr>";
if(isset($_POST['sig_response'])){
        $resp = Duo::verifyResponse(get_cfg_var('duo_ikey'), get_cfg_var('duo_skey'), get_cfg_var('duo_akey'), $_POST['sig_response']);
        if($resp != NULL){
                header('Location: http://localhost:99/edge');
        }
}
else if(isset($_POST['user']) && isset($_POST['pass'])){
        if($_POST['user'] == get_cfg_var('duo_user') && $_POST['pass'] == get_cfg_var('duo_pass')) {
                $sig_request = Duo::signRequest(get_cfg_var('duo_ikey'), get_cfg_var('duo_skey'), get_cfg_var('duo_akey'), $_POST['user']);
?>
                <script src="Duo-Web-v1.bundled.min.js"></script>
                <input type="hidden" id="duo_host" value="<?php echo get_cfg_var('duo_host') ; ?>">
                <input type="hidden" id="duo_sig_request" value="<?php $_SESSION["authenticated"] = "yes"; echo $sig_request; ?>">
                <script src="Duo-Init.js"></script>
                <iframe id="duo_iframe" width="620" height="500" frameborder="0" allowtransparency="true" style="background: transparent;"></iframe>
<?php
        }
}
else {
        echo "<form action='duo.php' method='post'>";
        echo "Username: <input type='text' name='user' /> <br />";
        echo "Password: <input type='password' name='pass' /> <br />";
        echo "<input type='submit' value='Submit' />";
        echo "</form>";
}
?>

1 个答案:

答案 0 :(得分:0)

我希望以下链接有帮助

http://plnkr.co/edit/h9MsdAUk0AFloHQu5eNu?p=preview

HTML代码

  <body>
    <h1>Hello Plunker!</h1>
    <div ng-controller="MyCtrl">
      <div id='red' class="red"></div>
      <div class="blue" ng-style="{width:{{getRedWidth()}}}"></div>
    </div>
  </body>

Script.js文件

var app = angular.module('app', []);

app.controller('MyCtrl', function mainController($scope){

  $scope.getRedWidth = function (){

    var red = document.getElementById('red');
    var redWidth = red.offsetWidth;
    console.log(redWidth);
    return "'"+redWidth+"px'";
  }
});