由于某些原因,图片的宽度不能设置成自适应的,想要轮播图片自适应手机横屏竖屏,只能用js来控制图片的大小了。
<div id="mgg" style="width: ${ width }px;"> <ul class="tag-pic" style="width: 100000px;"> <c:forEach var="ad" items="${ adList }" > <li> <img width="${width }" height="${height }" src="${ ad.url }"> </li> </c:forEach> </ul> </div>
<script type="text/javascript"> //默认值 Mgg = { setWidth : '${width }', setHeigth : '${height }', step : $(document).width() == '' ? 324 : parseInt($(document).width())+4, imgs : 3 //图片的数量 }; Mgg.changeSize() = function(){ //取当前屏幕宽度 var screenWidth = $(document).width(); Mgg.step = screenWidth == '' ? 324 : parseInt(screenWidth)+4; //计算高度 var height = (Mgg.setHeigth / Mgg.setWidth) * screenWidth; $('#mgg').css("width", screenWidth); $('#mgg').css("height", height); $('#mgg .tag-pic').width((Mgg.imgs + 2)*Mgg.step); $('#mgg .tag-pic img').each(function(){ $(this).attr("width", screenWidth); $(this).attr("height", height); }); }; $(window).resize(function(){ Mgg.changeSize(); }); $(document).ready(function(){ //图片尺寸 Mgg.changeSize(); }); </script>
相关推荐
如果你发现你怎么样去弄都不能把手机的界面布局做好,甚至你连怎么做都不知道的话,赶紧下载这个看看!
ANDROID自适应屏幕大小和LAYOUT布局横屏竖屏
Android自适应屏幕大小和layout布局(横屏竖屏)[定义].pdf
Android studio通过切换不同layout实现横竖屏适配
包括屏幕界面布局、多分辨率支持、获取屏幕尺寸、屏幕横屏与竖屏等,android 模拟器横屏,android 虚拟机横屏,android 判断横屏,android 禁止横屏,android 强制横屏,android 横屏事件,android 自适应分辨率,...
android应用开发,包括横竖屏的切换以及屏幕自适应
能够想要做移动端浏览器全屏自适应,或者更更改里面的一些代码实现按分辨率等比例全显,使用本模板发布在手机浏览器上无论横屏竖屏怎么转换都能正常显示,使用说明:...
要想实现css屏幕大小自适应,.../* 这是匹配横屏的状态,横屏时的css代码 */ @media all and (orientation :landscape){} /* 这是匹配竖屏的状态,竖屏时的css代码 */ @media all and (orientation :portrait){} @me
cell行高自适应,一句代码搞定需求,丝滑般顺畅的滚动体验,同时兼容横竖屏 一句代码集成 最新代码在github:https://github.com/shunFSKi/FSAutoAdjust-cellHeightDemo
anroid 简单应用 登录界面自适应横竖屏布局切换,自己写的主页面的toolsbar重写了BaseAdpter,展现类似博客的主页面。
自适应竖屏和横屏模式,tab 上的图标会根据竖屏和横屏模式自动缩放大小以适应tab的高度。 • 自定义 tab bar 的高度; • 当进入下个视图时,可以自动隐藏tab bar; • 可以只显示图片,而不显示文字;并且当 ...
基于swipe4写了一个移动端的全屏滚动效果 但是图片始终不能自适应屏幕设备大小这里记录一下。 开始的时候要设置 移动端配置 <meta name="viewport" content="width=device-width, initial-scale=1, minimum-...
这个就厉害了,支持各种手机浏览器对图片的滑动浏览(苹果效果),支持横竖屏旋转自适应,除了IE系列兼容性无敌了,不过有谁手机用IE呢。这是我用古董手机上凤凰看新闻看到的,我那么低档的手机都可以顺畅滑动,...
Android中可以自动切换横竖屏,还有不同大小的分辨率,如何让一张图片适应以上要求呢,下面讲解了实现的方法,有需要的朋友可以参考一下
GReader Mobile 和web版Google Reader完美兼容. 程序需要.Net CF 3.5支持. 分辨率自适应. 支持横竖屏机.
而且Android屏幕大小也可以在横屏和竖屏之间切换,界面也需要调整。如何取得屏幕的方向:默认情况下,当屏幕方面切换时,activity的onCreate()方法会被重新调用,所以可以在其中通过以下代码来读取屏的方向:...
自适应横竖屏、键盘弹出; 5.可自定义缓存(控制器信息、默认位置)方案; 6.可自定义展开/闭合的提示音 7.可作用于有或无导航栏的情况 注意: 1.目前仅作用于NavigationController 之后的更新内容: ...
更新记录支持手机电脑访问查询(同一个页面自适应),手机横屏横向表格,竖屏竖向表格,。20180330对身份证号的解读更为完善,比如原来一律只判断三十一天现在对30天的小月和二月的时间判断更为正确。20170411增加一...
• 自适应竖屏和横屏模式,列表上的图标会根据竖屏和横屏模式自动缩放大小以适应列表的高度。 • 自定义选项卡的高度; • 当进入下个视图时,可以自动隐藏选项卡; • 可以只显示图片,而不显示文字;并且...