<style rel="stylesheet" type="text/css">

.lunboimg{ width: 100%; height: auto; float: left;}
.lunboimg img{ width: 100%; float: left;}

</style>

$(function(){
var evt = "onorientationchange" in window ? "orientationchange" : "resize";
window.addEventListener(evt, function () {
location.reload()
}, false); 判定屏幕旋转时,刷新页面,(防止图片获取宽度固定不变,图片不能自适应)

var width =$(window).width(); 获取手机浏览器的宽高
var height=$(window).height();
height=width*0.5; 图片高度=图片宽度的0.2 宽高比:2:1
$("#banner").css({"width":width, "height":height}); 获取缩放后的尺寸
});

<div class="lunboimg">
<img src="img/today.jpg" id="banner" >
</div>

手机端上传未知图片大小,js设置宽高比例的更多相关文章

  1. ecmall允许上传的图片大小

    $uploader->allowed_type($type); $uploader->allowed_size($size);  ecmall上传类型大小是这样定义,你可以去文件中搜索相关 ...

  2. elementUI 上传文件图片大小加了限制后 仍然上传了

    https://blog.csdn.net/chanlingmai5374/article/details/80558444  看了这位老哥的说法 在看看文档 才发现自己没认真看文档 <el-u ...

  3. 上传base64图片并压缩

    elementUI+react 布局 <Dialog title="充值" visible={ dialogVisible } onCancel={ () => thi ...

  4. PHP 多图上传,图片批量上传插件,webuploader.js,百度文件上传插件

    PHP  多图上传,图片批量上传插件,webuploader.js,百度文件上传插件(案例教程) WebUploader作用:http://fex.baidu.com/webuploader/gett ...

  5. js 显示刚刚上传的图片 (onchange事件)

    <table> <tr width="100"> <td>上传商场图片:</td> <td> <input typ ...

  6. ext js/Ext.Net_演示 htmleditor 上传&插入图片

    本文内容 解决方案结构 HtmlEditor_Upload.js 脚本 HtmlEditorUploadImg.ashx 上传图片到服务器 演示 htmleditor 控件添加插入图片功能   解决方 ...

  7. js如何展示上传的图片

    前言:本文章主要讲的是上传的图片如何展示在页面上. 一般来说,我们会先将本地图片上传到服务器,上传成功后,由后台返回图片的网络地址再在前端显示.但是,我今天讲的是不通过前面说的过程,而是直接使用js将 ...

  8. js上传压缩图片

    原文链接:http://blog.csdn.net/iefreer/article/details/53039848 手机用户拍的照片通常会有2M以上,这对服务器带宽产生较大压力. 因此在某些应用下( ...

  9. webform文件上传、图片水印、验证码

    文件上传: 所用控件:FileUpload 使用时的思路: 1.判断用户是否选中了文件 FileUpload.FileName获取选中的文件名,判断长度,如果长度大于零就代表已经选择了文件 JS端:通 ...

随机推荐

  1. Power-BI 主要城市商品房销售分析

    经常在网上看到有关房价的讨论,房价可能真的悬了,高房价撑不了多久,一线城市房价远高于国际,暴涨游戏该结束了,等等.那么近年来房价整体上究竟是一个什么样的状态?今天我们撇开宏观经济要素,来看看近年来主要 ...

  2. Android适配(屏幕适配、国际化适配)-转

    首先来说一下Android的屏幕适配: 关于Android屏幕的一些基本概念知识,自行充电..在此只介绍实际开发过程中的使用 1.说到Android的屏幕适配,首当其冲的就是图片的适配 图片适配遵循两 ...

  3. Java多例设计模式

    class TrafficLight{ private String lightType; private static final TrafficLight GREENLIGHT = new Tra ...

  4. oc 关键字

    assign适用于基本数据类型,weak是适用于NSObject对象,并且是一个弱引用. assign其实页可以用来修饰对象,那么为什么不用它呢?因为被assign修饰的对象在释放之后,指针的地址还是 ...

  5. css 字体样式

    [强制] font-family 属性中的字体族名称应使用字体的英文 Family Name,其中如有空格,须放置在引号中. 解释: 所谓英文 Family Name,为字体文件的一个元数据,常见名称 ...

  6. M面经Prepare: Positive-Negative partitioning preserving order

    Given an array which has n integers,it has both positive and negative integers.Now you need sort thi ...

  7. C#面向对象的方法写数组的功能

    上一篇文章用Java方法写出了可以对数组执行的功能,然后在用实例化后的对象调用这些方法来实现这些功能: 这篇随笔改用C#语言实现同样的功能 方法类:Array using System; using ...

  8. C# 在Visual Studio中一个项目有两个Main函数, 怎么设置哪个是入口?取代csc /main选项。

    namespace ConsoleApp1{class Program{static void Main(string[] args){Console.WriteLine("Program& ...

  9. ./fedora_install_oracle.sh bad interpreter

    错误原因之一很有可能是你的脚本文件是DOS格式的, 即每一行的行尾以\r\n来标识, 其ASCII码分别是0x0D, 0x0A.可以有很多种办法看这个文件是DOS格式的还是UNIX格式的, 还是MAC ...

  10. js 获取select 中option 的个数

    //document.writeln(document.getElementById("sel").options.length); //document.writeln(docu ...