有个项目移动端的首页需要自适应。

宽度已经自适应了 , 高度也要自适应 ,先总结一下方法,PC端也适用。

$(function(){
var h = window.innerHeight;
$(".carousel-inner>.item>a>img, .carousel-inner>.item>img, .img-responsive, .thumbnail a>img, .thumbnail>img").css("height",h*0.32);
$(".database-con .col-xs-6 a").css("height",h*0.16);
$(".search-bg").css("height",h*0.12);
$(".home-footer").css("height",h*0.08);
});

把上面代码贴出来,供大家使用。

页面高度自适应方法(PC、移动端都适用)的更多相关文章

  1. swiper 不同页面高度自适应

    在使用swiper写页面滑动时发现不同页面高度无法自适应,使用autoHeight:true也不起作用 研究了一下发现可以这样设置 .swiper-slide{ overflow: hidden; } ...

  2. 非一屏页面,出现遮罩层页面位置不动,并且遮罩层一屏显示。(pc,移动端都适用的方法)

    首先展示页面效果: 遮罩没出现的页面张酱紫:页面在楼层二这个位置. 遮罩显示:后面页面页面任停留在当前浏览位置,滚动条并未回顶部 下面来说说写法: css: 页面具体布局样式......(此处省略无数 ...

  3. iframe高度自适应方法

    <iframe width="100%" id="tbbrecommend" name="tbbrecommend" src=&quo ...

  4. html页面高度自适应

    本文实现的效果是依据浏览器分辨率的不同.页面底端背景色自适应浏览器高度,也就是能够自己主动填充背景色. <script type="text/javascript"> ...

  5. tabs高度自适应方法

    1.去掉easyui-tabs类属性,改为id=tabs 2.用js控制高度

  6. iframe父页面和子页面高度自适应

    父页HTML: <iframe  id="mainframe" name="mainframe"  style="width:100%;&quo ...

  7. iframe高度自适应方法大全

    http://www.3tii.com/993.html http://caibaojian.com/iframe-adjust-content-height.html http://www.jb51 ...

  8. vue iframe嵌套页面高度自适应 (ios 宽度扩大的bug , ios展示比例问题)

    <template>   <div class="card-index pt-relative">     <div id="wrapper ...

  9. textarea如何实现高度自适应?

    今天需要些一个回复评论的页面,设计师给的初始界面就是一个只有一行的框.然后当时就想这个交互该怎么实现比较好,然后想起了新浪微博的做法:点击评论,默认显示一行,当输入的文字超过一行或者输入Enter时, ...

随机推荐

  1. 《内蒙古自治区第十二届大学生程序设计竞赛试题_G: 最大收益》

    问题 G: 最大收益 内存限制:128 MB时间限制:1 S标准输入输出 题目类型:传统评测方式:文本比较上传者:外部导入 提交:87通过:23 返回比赛提交提交记录 题目描述 Elly的叔叔经营一家 ...

  2. Archives: 2013/6

    OpenStack环境搭建 这一步有两个选择: 一种就是正统的真实搭建,所有都按生产环境来部署,费时费力. 还有一种就是官方推荐的一键安装DevStack,直接安装最新的版本,体验最新的特性. 至于如 ...

  3. 如果你的unordered_map头文件报错请看这里

    请将include<unordered_map>头文件换成下面代码 #if(__cplusplus == 201103L) #include <unordered_map> # ...

  4. Servlet.service() for servlet [appServlet] in context with path [/item] threw exception [Request processing failed

    以前犯过的一个小错误,不过忘记怎么修改了,所以还是记录下来好一点 严重: Servlet.service() for servlet [appServlet] in context with path ...

  5. SWUST OJ 青蛙的约会之二(0481)

    青蛙的约会之二(0481) Time limit(ms): 1000 Memory limit(kb): 65535 Submission: 138 Accepted: 28   Descriptio ...

  6. springboot 多数据源之错误 HikariPool-1 - jdbcUrl is required with driverClassName.

    数据源连接报错: 之前在1.5.7的版本的时候用该数据源配置没问题,看如下所示 springboot1.5.7配置多数据源: datasource.master.url=jdbc:mysql://lo ...

  7. B站实战第三天

    B站实战第三天 用了两天多的时间才把B站页面的头部写完,今天来写头部下面的导航栏部分和轮播图一些模块. 因为还没学js,轮播图部分用swiper来实现. 今天首先复习的知识点是弹性盒模型. 弹性盒模型 ...

  8. charles添加https支持

  9. Java入门教程十三(多线程)

    线程的概念 单纯种以一个任务完成以后再进行下一个任务的模式进行,这样下一个任务的开始必须等待前一个任务的结束,只有一个任务完成后才能进行下一个任务.Java 语言提供了并发机制,允许开发人员在程序中执 ...

  10. SpringBoot入门系列(一)如何快速创建SpringBoot项目

    这段时间也没什么事情,所以就重新学习整理了Spring Boot的相关内容.今天开始整理更新Spring Boot学习笔记,感兴趣的朋友可以关注我的博客:https://www.cnblogs.com ...