今天学习过程中,发现一个超实用的方法,就是当页面有尾部,但是内容又不多的情况下,让中间的内容把尾部撑到底部。

<script type="text/javascript">
        var statusTokenId="${statusTokenId!}";

        function register_box_w (a,b){
            var h = parseInt(document.documentElement.clientHeight||document.body.clientHeight);
            h = h-225-62;
            a.css({
                height:h+'px'
            });
            if(h>=600){
                b.css({
                    'padding-top':(h-650)/2+"px"
                })
            }

        }
        $(function(){
          register_box_w($(".login_content"),$(".loginmain"));//参数放登录的那个大框div
          $(window).resize(function(){
            register_box_w($(".login_content"),$(".loginmain"));//参数放登录的那个大框div
          });
        })
    </script>

方法中的数值可以根据实际情况更改。

Js-Html 前端系列--页面撑开头尾的更多相关文章

  1. [后端人员耍前端系列]AngularJs篇:30分钟快速掌握AngularJs

    一.前言 对于前端系列,自然少不了AngularJs的介绍了.在前面文章中,我们介绍了如何使用KnockoutJs来打造一个单页面程序,后面一篇文章将介绍如何使用AngularJs的开发一个单页面应用 ...

  2. js实现前端分页页码管理

    用JS实现前端分页页码管理,可以很美观的区分页码显示(这也是参考大多数网站的分页页码展示),能够有很好的用户体验,这也是有业务需要就写了一下,还是新手,经验不足,欢迎指出批评! 首先先看效果图: 这是 ...

  3. 前端进阶试题css(来自js高级前端开发---豪情)既然被发现了HOHO,那我就置顶了嘿嘿!觉得自己技术OK的可以把这套题目做完哦,然后加入高级前端的社区咯

    http://www.cnblogs.com/jikey/p/4426105.html js高级前端开发加群方法(此群很难进,里面纯技术,严禁广告,水群) 完整题目做完发邮箱(jikeytang@16 ...

  4. HTML、CSS、JS在前端开发中都扮演怎样的角色

    前端开发,需要经常接触 HTML.DOM.CSS.JS等,那么HTML.CSS.JS在前端开发中究竟扮演怎样的角色呢?以下是个人的一些观点... HTML:超文本标记语言 (Hyper Text Ma ...

  5. [后端人员耍前端系列]AngularJs篇:使用AngularJs打造一个简易权限系统

    一.引言 上一篇博文已经向大家介绍了AngularJS核心的一些知识点,在这篇博文将介绍如何把AngularJs应用到实际项目中.本篇博文将使用AngularJS来打造一个简易的权限管理系统.下面不多 ...

  6. Space.js – HTML 驱动的页面 3D 滚动效果

    为了让我们的信息能够有效地沟通,我们需要创建用户和我们的媒体之间的强有力的联系.今天我们就来探讨在网络上呈现故事的新方法,并为此创造了一个开源和免费使用的 JavaScript 库称为 space.j ...

  7. Headroom.js – 快速响应用户的页面滚动操作

    Headroom.js 是一个轻量级,高性能的JS插件(无依赖性!),允许你响应用户的滚动行为.Headroom.js 使您能够在适当的时候把元素融入视图,而其它时候让内容成为焦点.Headroom. ...

  8. Pace.js – 超赞的页面加载进度自动指示和 Ajax 导航效果

    在页面中引入 Pace.js  和您所选择主题的 CSS 文件,就可以让你的页面拥有漂亮的加载进度和 Ajax 导航效果.不需要挂接到任何代码,自动检测进展.您可以选择颜色和多种效果,有简约,闪光灯, ...

  9. Vue 2.x + Webpack 3.x + Nodejs 多页面项目框架(上篇——纯前端多页面)

    Vue 2.x + Webpack 3.x + Nodejs 多页面项目框架(上篇--纯前端多页面) @(HTML/JS) 一般来说,使用vue做成单页应用比较好,但特殊情况下,需要使用多页面也有另外 ...

随机推荐

  1. Inno Setup connection to the database and create

    原文 Inno Setup connection to the database and create Description: the first half of this program in I ...

  2. solr的安装与配置

    solr的安装与配置 不久之前开发了一个项目,需要用到solr,因为所以在开始再网上查找资料,但是发现大部分的资料都是很片面的,要么就是只讲解solr如何安装的,要么就是只讲解solr的某一个部分的, ...

  3. Scala是一门现代的多范式编程语言

    Scala是一门现代的多范式编程语言 Scala是一门现代的多范式编程语言,志在以简练.优雅及类型安全的方式来表达常用编程模式.它平滑地集成了面向对象和函数语言的特性. Scala是面向对象的:Sca ...

  4. QualityCenter的备份

    1.停止QC Server:2.备份Domain repository,它囊括每个项目的大量数据(包括自动化测试数据.附件.设置和格式表单等).要想知道某个项目所使用的数据库的名字,可以在Site A ...

  5. QTP中DataTable操作大全

    序曲 假设现在有一个Excel文件:D:\data.xls,里面的具体内容如下:有两个Sheet,第一个叫Login,第二个叫InsertOrder: 当前QTP的Test中有两个Action:Log ...

  6. sql常用语句汇总

    --创建数据库 USE yuju CREATE database YuJu on primary ( name='YuJu', filename='B:\ceshi数据库\YuJu.mdf', max ...

  7. Go语言搭建自己的博客

    我是如何用Go语言搭建自己的博客的   前言: 话说,已经很久没有在博客园更新博客了,之前写的关于go语言的系列学习文章<让我们一起Go>也由于种种原因一度中断.但是,正如我之前在文章中所 ...

  8. 关于readonly

    当某个字段是引用类型,且该字段是readonly类型时,那么不可改变的是引用,而非引用的对象.如以下代码: public sealed class AType { public static read ...

  9. Oracle 补丁及opatch 工具介绍

    一. CPU(Critical Patch Update) 一个CPU内包含了对多个安全漏洞的修复,并且也包括相应必需的非安全漏洞的补丁.CPU是累积型的,只要安装最新发布的CPU即可,其中包括之前发 ...

  10. System.Net.Http 简介

    System.Net.Http 简介 System.Net.Http 是微软推出的最新的 HTTP 应用程序的编程接口, 微软称之为“现代化的 HTTP 编程接口”, 主要提供如下内容: 1. 用户通 ...