jQuery移动按钮默认旋转90°并添加到网格

Question

如何实现默认向右或向左旋转90°的按钮？我不想让他开启onClick，但他应该在页面加载时就已经开启了？

此外，如何将此按钮放置在网格右侧的垂直中心？

像这样:

谢谢， zY

Answer 1

DEMO FIDDLE

<div class="grid">
    <div class="block block_a">
        <div class="content"></div>
    </div>
    <div class="block block_a"></div>
    <div class="button"> button </div>   
</div>

<小时/>

var btn = $('.button');
btn.css('transform','rotate(90deg)'); 

针对 IE 的修复方法是将 div 替换为图像，或者只是设置一个单独的 css 来处理按钮样式。

<小时/>

正如OP所问的'...啊!请...让它在 IE 中工作!？...' ;) 这里有一个关于如何做到这一点的示例:

DEMO FOR IE 8,7,(and believe it or not) 6!

只需添加到之前的代码 - 并根据您的需要修改“px”以最佳定位 DIV

if($.browser.msie && $.browser.version<="8.0"){
    btn.css({
        filter: 'progid:DXImageTransform.Microsoft.BasicImage(rotation=1)',
        top:'100px',
        left: '184px'   
    });   
}

唯一的一件事...(悲伤但真实)

IE DX 过滤器仅允许 4 个阶段的旋转 (1,2,3,4)，因此您将无法将元素旋转一个奇特的角度位置，如 37° 或执行以下操作:BasicImage (旋转=2.3)。