页面高度自适应方法(PC、移动端都适用)
有个项目移动端的首页需要自适应。
宽度已经自适应了 , 高度也要自适应 ,先总结一下方法,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、移动端都适用)的更多相关文章
- swiper 不同页面高度自适应
在使用swiper写页面滑动时发现不同页面高度无法自适应,使用autoHeight:true也不起作用 研究了一下发现可以这样设置 .swiper-slide{ overflow: hidden; } ...
- 非一屏页面,出现遮罩层页面位置不动,并且遮罩层一屏显示。(pc,移动端都适用的方法)
首先展示页面效果: 遮罩没出现的页面张酱紫:页面在楼层二这个位置. 遮罩显示:后面页面页面任停留在当前浏览位置,滚动条并未回顶部 下面来说说写法: css: 页面具体布局样式......(此处省略无数 ...
- iframe高度自适应方法
<iframe width="100%" id="tbbrecommend" name="tbbrecommend" src=&quo ...
- html页面高度自适应
本文实现的效果是依据浏览器分辨率的不同.页面底端背景色自适应浏览器高度,也就是能够自己主动填充背景色. <script type="text/javascript"> ...
- tabs高度自适应方法
1.去掉easyui-tabs类属性,改为id=tabs 2.用js控制高度
- iframe父页面和子页面高度自适应
父页HTML: <iframe id="mainframe" name="mainframe" style="width:100%;&quo ...
- iframe高度自适应方法大全
http://www.3tii.com/993.html http://caibaojian.com/iframe-adjust-content-height.html http://www.jb51 ...
- vue iframe嵌套页面高度自适应 (ios 宽度扩大的bug , ios展示比例问题)
<template> <div class="card-index pt-relative"> <div id="wrapper ...
- textarea如何实现高度自适应?
今天需要些一个回复评论的页面,设计师给的初始界面就是一个只有一行的框.然后当时就想这个交互该怎么实现比较好,然后想起了新浪微博的做法:点击评论,默认显示一行,当输入的文字超过一行或者输入Enter时, ...
随机推荐
- 3DSMAX 卸载工具,完美彻底卸载清除干净3dsmax各种残留注册表和文件
一些同学安装3dsmax出错了,也有时候想重新安装3dsmax的时候会出现这种本电脑已安装3dsmax,你要是不留意直接安装,只会安装3dsmax的附件,3dsmax是不会安装上的.这种原因呢就是大家 ...
- Mybatis-Plus的分页插件
使用的是:Mybatis-Plus的分页插件https://baomidou.gitee.io/mybatis-plus-doc/#/?id=%E7%AE%80%E4%BB%8B 1.Mapper.j ...
- jquery mobile AJAX特性的陷阱
简单情况是 MVC 重定向,URL不变 试了N种方式,跳来跳去,无解,服务端跳,写JS跳,生成跳转中间页跳.失败 后来一看,明明已经跳到新页了,样式什么还是原页的,有点火大了. 出去溜一圈,喝杯水,和 ...
- MyBatis学习笔记二:MyBatis生产中使用环境搭建
这里是在上一个环境的基础上修改的,这里就不在给出所有的配置,只给出哪里修改的配置 1.修改POJO对象为注解方式 2.创建Dao层接口 package com.orange.dao; import c ...
- fastdfs+nginx make时报错fatal error:fdfs_define.h: 没有那个文件或目录
环境: ubuntu 18.04.1 fastdfs-nginx-module_v1.16 root@wang-machine:~/桌面/FastDFS# cd nginx-1.8.1/root@wa ...
- 整数拆分-dp问题
Integer Partition In number theory and combinatorics, a partition of a positive integer n, also call ...
- idea 使用sonarlint报错解决方案
在idea使用sonarlint可能出现以下报错: Plugin 'org.sonarlint.idea' failed to initialize and will be disabled. Ple ...
- ibator使用
一.ibator是一个ibatis的代码生成工具,它能根据数据表自动生成javabean.sqlmap. ibator的官方地址是 http://ibatis.apache.org/ibator.ht ...
- 秒搭Kubernetes之使用Rancher
Rancher 在接触Docker和K8s的前阶段就耳闻目睹到Rancher,但是没有进一步接触过.直到将K8s搭建完成.才进一步了学习与实践Rancher. Rancher是简便易用的容器管理.其中 ...
- StringUtil中isBlank(),idNUll,isEmpty的区别
StringUtils 方法的操作对象是 java.lang.String 类型的对象,是 JDK 提供的 String 类型操作方法的补充,并且是 null 安全的(即如果输入参数 String 为 ...