应用带有浏览器前缀的内联样式 [英] Applying inline styles with browser prefixes

问题描述

我发现了一个小技巧，可以让我使用jquery向带有供应商前缀的类中添加样式:

I found a little trick that allows me to use jquery to add styles to a class with vendor prefixes:

 var myTransform = ($.browser.webkit)  ? '-webkit-transform' :
                       ($.browser.mozilla) ? '-moz-transform' : 
                       ($.browser.msie)    ? '-ms-transform' :
                       ($.browser.opera)   ? '-o-transform' : 'transform';

var myCSSObj = {};

    myCSSObj[myTransform] = 'translate('+centrepos+'px, 0px)';
        $("div.current").css(myCSSObj);

我不确定这是如何工作的，因此，如果有人可以解释一下，我将非常感激.

I'm not entirely sure how this works, so if someone could explain I would be really appreciative.

但是，我的问题是关于应用此方法并将其添加到jQuery片段的内联样式中.目前，我有以下内容，但是是手动编写的:

But, my question is about applying this method and adding it to an inline style to a jquery fragment. Currently I have the following, but it is manually written:

$fragment = $('<div class="preload" style="position: relative; -webkit-transform: translate('+start+'px, 0px);"/>');

当它附加到dom时，我想给这个容器一个初始位置.如何添加代码而不必手动添加每个浏览器的前缀?

I want to give this container an initial position when it is appended to the dom. How can I add the code without having to manually add each browser's prefix?

推荐答案

如果我正确理解，您希望自动化将特定于供应商的前缀添加到CSS属性的过程.

If I understood it correctly you want to automate the process of adding vendor-specific prefixed to your css properties.

jquery核心中包含一个API，您可以执行此操作. jQuery.cssHooks

there is an API included in jquery core that allows you to do this. jQuery.cssHooks

在文档中，有一个很好的示例，说明了对border-radius做类似的思考.

In the documentations there is a nice example about doing similar think for border-radius.

这篇关于应用带有浏览器前缀的内联样式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！