图片在浏览器中底部对齐 解决方法之一
更新时间：2011年11月30日 23:43:08 作者：
需要在列表中显示很多图片，图片高低不同，宽度都设置一样了，要底部对齐
style="vertical-align:bottom;"不管用，上网搜索说要用js实现，找了个代码，测试不成功，主要是代码太多太乱没法心情测试了。
于是就自己写吧。
$(function () {
if ($.browser.msie || $.browser.mozilla || $.browser.opera) {//IE 火狐 Opera之类浏览器
$(".productli img").each(function () {
var margin = 120 - $(this).height();
$(this).css("margin-top", margin + "px");
});
}
if ($.browser.safari) {//如果是苹果或chrome浏览器
$(".productli img").load(function () {
var margin = 120 - $(this).height();
$(this).css("margin-top", margin + "px");
});
}
})
经测试以下浏览器通过
IE6、 IE8、Chrome、 Opear、 FireFox、 QQ浏览器、 360、 傲游、 苹果
百度之类IE内核的就没测了肯定能用。
期待更精简代码出现。
于是就自己写吧。
复制代码 代码如下:
$(function () {
if ($.browser.msie || $.browser.mozilla || $.browser.opera) {//IE 火狐 Opera之类浏览器
$(".productli img").each(function () {
var margin = 120 - $(this).height();
$(this).css("margin-top", margin + "px");
});
}
if ($.browser.safari) {//如果是苹果或chrome浏览器
$(".productli img").load(function () {
var margin = 120 - $(this).height();
$(this).css("margin-top", margin + "px");
});
}
})
经测试以下浏览器通过
IE6、 IE8、Chrome、 Opear、 FireFox、 QQ浏览器、 360、 傲游、 苹果
百度之类IE内核的就没测了肯定能用。
期待更精简代码出现。
相关文章
本文搜集了大量 jQuery 表格插件，帮助 Web 设计者更好地驾御 HTML 表格，你可以对表格进行横向和竖向排序，设置固定表头，对表格进行搜索，对大表格进行分页，对表格进行滚动，拖放操作等等。这些插件很多都包含详细的教程。2010-04-04
这篇文章介绍了JQ获取动态加载的图片大小的正确方法，有需要的朋友可以参考一下2013-11-11
360全景就是视角超过人的正常视角的图像，而我们这里说的全景特指水平视角360度，垂直视角180度的图像。可以全景空间里进行切换，达到浏览各个不同场景360全景展示的目的。2015-03-03
相信很多人都上过taobao吧，在taobao的产品列表页有一个浮动的用来排序的浮动层，当你拖动滚动条而导致那个排序栏看不到的时候它会自动变为浮动层，一直固定在那里。2010-02-02
jquery实现滑屏大图定时收缩为小banner图片的广告代码
这篇文章主要介绍了jquery实现滑屏大图定时收缩为小banner图片的广告代码,可实现大幅广告图的渐显效果及定时收缩功能,点击左上角关闭按钮还可隐藏广告图片,非常具有实用价值,需要的朋友可以参考下2015-09-09
本文给大家分享基于jquery步骤进度条源码分享，实现功能是这样的，在输入框中输入第3步，点击重新生成按钮，相应的步骤颜色就会加深，对jquery步骤进度条感兴趣的朋友一起看看吧2015-11-11
下面小编就为大家带来一篇jquery 删除节点 添加节点 找兄弟节点的简单实现。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2016-12-12
本文主要对jQuery选择器进行一一举例介绍，有助于学习、理解和记忆。具有很好的参考价值，下面就跟着小编一起来看下吧2016-12-12
jquery 查找iframe父级页面元素的实现代码，学习jquery的朋友可以参考下。2011-08-08
这个脚本是网上的代码修改的，兼容各主流浏览器，优化页面异步加载的文字的检索提示框定位，根据选择文字位置与屏幕尺寸计算检索提示框定位。2010-09-09
最新评论