<!DOCTYPE html>

<html ng-app="app">

<head>

<title>柳絮飞祭奠</title>

<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">

<meta http-equiv="description" content="this is my page">

<meta http-equiv="content-type" content="text/html; charset=UTF-8">

<script type="text/javascript" src="/APP-INF/plugins/angular/angular.js"></script>

</head>

<body>

<div lx-ui-auto="" height-remove="10" style="background-color: red;"></div>

</body>

<script type="text/javascript">

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

	/**

	 * height-remove 设置窗口高度需要移除的高度值，如移除顶部导航高度50

	 * height-tag    设置是按height还是min-height设置高度值，height才会出现滚动条。

	 */

	app.directive('lxUiAuto', function($window) {

		return {

			restrict : 'A',

			scope : {},

			link : function($scope, $element, $attrs) {

				if($attrs.heightTag==undefined){

					$element.css("min-height", ($window.innerHeight-$attrs.heightRemove) + 'px');

				}else{

					$element.css($attrs.heightTag, ($window.innerHeight-$attrs.heightRemove) + 'px');

				}

			}

		};

	});

</script>

</html>

效果：



Angularjs自定义指令计算浏览器高度的更多相关文章

  1. AngularJs自定义指令详解（1） - restrict

    下面所有例子都使用angular-1.3.16.下载地址:http://cdn.bootcss.com/angular.js/1.3.16/angular.min.js 既然AngularJs快要发布 ...

  2. AngularJS: 自定义指令与控制器数据交互

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  3. 浅析AngularJS自定义指令之嵌入(transclude)

    AngularJS自定义指令的嵌入功能与vue的插槽十分类似,都可以实现一些自定义内容展现.在开始之前先简单介绍下自定义指令的transclude属性和AngularJS的内置指令ng-transcl ...

  4. angularjs自定义指令Directive

    今天学习angularjs自定义指令Directive.Directive是一个非常棒的功能.可以实现我们自义的的功能方法. 下面的例子是演示用户在文本框输入的帐号是否为管理员的帐号"Adm ...

  5. angularJs 自定义指令传值---父级与子级之间的通信

    angularJs自定义指令用法我忽略,之前有写过,这里只说一下父子级之间如何传值: 例如: 模块我定义为myApp,index.html定义 <my-html bol-val="bo ...

  6. AngularJs自定义指令详解（6） - controller、require

    在前面文章中提到一旦声明了require,则链接函数具有第四个参数:controller. 可见require和controller是配合使用的. 在自定义指令中使用controller,目的往往是要 ...

  7. 利用angularJs自定义指令（directive）实现在页面某一部分内滑块随着滚动条上下滑动

    最近老大让我一个效果实现在页面某一部分内滑块随着滚动条上下滑动,说明一下我们项目使用技术angularJs.大家都知道,使用jquery很好实现. 那么angular如何实现呢,我用的是自定义指令(d ...

  8. angularJs自定义指令（directive）实现滑块滑动

    最近老大让我一个效果实现在页面某一部分内滑块随着滚动条上下滑动,说明一下我们项目使用技术angularJs.大家都知道,使用jquery很好实现. 那么angular如何实现呢,我用的是自定义指令(d ...

  9. angularJs自定义指令.directive==类似自定义标签

    创建自定义的指令 除了 AngularJS 内置的指令外,我们还可以创建自定义指令. 你可以使用 .directive 函数来添加自定义的指令. 要调用自定义指令,HTML 元素上需要添加自定义指令名 ...

随机推荐

  1. WordPress版微信小程序开发系列(二):安装使用问答

    自WordPress版微信小程序发布开源以来,受关注的程度超过我原来的想象.这套程序主要面对的用户是wordpress网站的站长,如果wordpress站想在微信的生态圈得到推广,小程序成为一种重要的 ...

  2. PV、IV、UV

    PV  访问量 UV 独立访客 IV 独立ip数 qps 流量

  3. react购物车

    import React, { Component } from 'react';   import {Tabs} from './Tabs'   import 'whatwg-fetch'   im ...

  4. SpringBoot 六问

    1.什么是springboot         用来简化spring应用的初始搭建以及开发过程 使用特定的方式来进行配置(properties或yml文件)                  创建独立 ...

  5. 日志模块logging

    import logging # 设置日志基础样式 logging.basicConfig(level=logging.INFO, format='levelname:%(levelname)s fi ...

  6. spring boot 接口用例测试

    接口: 测试用例:

  7. MATLAB——矩阵排序详解

    <span style="font-size:18px;">(1)B=sort(A) 对一维或二维数组进行升序排序,并返回排序后的数组,当A为二维时,对数组每一列进行排 ...

  8. C#与Excel的交互示例

    //这里加添加一个Excel对象的包装器.就是添加一个引用 using System; using System.Drawing; using System.Collections; using Sy ...

  9. python 对象转字典

    从数据库中取出的数数据是 对象类型的,不能直接展示出来,需要转成字典类型,然后转成json 字符串,传给前端: data = {} data.update(obj.__dict__) print(da ...

  10. Linux Shell 简介

    什么是 Shell Shell 是用户和 Linux 内核之间的接口程序,当从 Shell 或其他程序向 Linux 传递命令时,内核会做出相应的反应: Shell 是一个命令语言解释器,它拥有自己内 ...