网络编程
位置:首页>> 网络编程>> JavaScript>> 使用javascript修复浏览器中12个常见而又头痛的问题(3)

使用javascript修复浏览器中12个常见而又头痛的问题(3)

作者:小鼠 来源:译言 发布时间:2008-10-28 19:38:00 

标签:浏览器,布局,javascript,css

4. 浏览器中的CSS选择器

试想一下,你只要键入一个特殊的选择器,你就可以为当前浏览器中设置了类名的元素编写javascript代码了.

4.1 CSS Browser

这是一段非常简单的javascript代码,它短小精悍,能使你使用CSS选择器.使用它你可以在任何浏览器编写特殊的CSS代码. 你可以为浏览器中设置了类名的元素写上一段javascript代码.

jQuery browser selectors
另外一个选择就是使用jQuery,它可以让你使用浏览器的选择器更加方便,你所需要做的事就是引入jQuery, 然后编写如下代码:


$(document).ready(function(){ 
    $('html').addClass($.browser);

}); 


现在你可以准备好.msie, .mozilla, .opera, .safari 或 .other 这些依赖目标浏览器的样式了.

5. 最大/最小宽高支持

对于CSS的min-width, min-height, max-width, max-height, border-*-width, margin, 与padding属性在某些浏览器不被支持的问题,jQuery提供了非常好的解决方案.

5.1 jQMinMax

这个jQuery插件为没有提供原生支持min-width, max-width, min-height与max-height这些属性的浏览器添加支持.

5.2 JSizes

这个基于jQuery的小插件为CSS的min-width, min-height, max-width, max-height, border-*-width, margin, 还有padding属性提供支持.另外,它还提供了一个检查元素是否可见的方法.由于它所有与大小相关的方法都是返回数值,所以用于计算DOM元素的尺寸 是非常安全的.

下载的例子演示了可以使用无返回值的方法链.


jQuery(function($) {

   var myDiv = $('#myDiv');   // set margin-top to 100px and margin-bottom to 10em   myDiv.margin({top: 100, bottom: '10em'});   // displays the size of the top border in pixels   alert(myDiv.border().top);   // displays true if the element is visible, false otherwise   alert(myDiv.isVisible());   // set padding-right to 10px and margin-left to 15px using chaining   myDiv.padding({right: 10}).margin({left: 15});});


0
投稿

猜你喜欢

手机版 网络编程 asp之家 www.aspxhome.com