Question

我正在试图找出为什么我的代码不起作用。该按钮仅在您单击某个区域时有效。如果您尝试在文本之间或其上方单击，则不会发生任何事情。请在这里看到我的小提琴：

我认为它必须对我的一个阴影做一些事情：

 box-shadow:        inset 0px -4px 5px rgba(255,255,255,0.2),
                        inset 0px 1px 5px rgba(255,255,255,0.2),
                        /**/
                        0px 12px 0px #231F20,
                        0px 14px 0px #231F20,
                        0px 16px 0px #231F20,
                        /**/
                        0px 8px 5px rgba(0,0,0,0.5);

    -moz-box-shadow:    inset 0px -4px 5px rgba(255,255,255,0.2),
                        inset 0px 1px 5px rgba(255,255,255,0.2),
                        /**/
                        0px 12px 0px #231F20,
                        0px 14px 0px #231F20,
                        0px 16px 0px #231F20,
                        /**/
                        0px 8px 5px rgba(0,0,0,0.5);

    -webkit-box-shadow: inset 5px -4px 5px rgba(255,255,255,0.2),
                        inset 5px 1px 5px rgba(255,255,255,0.2),
                        /**/
                        0px 12px 0px #231F20,
                        0px 14px 0px #231F20,
                        0px 16px 0px #231F20;
}

Answer 1

您需要适当地设置transform-origin-y（因为您围绕X轴旋转）。默认值为50％，这使得您无法单击旋转元素的一部分。我认为这有点不稳定，但这似乎是问题所在。

transform-origin-y: 0

这会修复它，虽然它确实会将按钮向上移动一点。如果需要，请添加更多上边距：

http://jsfiddle.net/Zv6Cx/5/

按钮无法正常工作（onclick事件）

1 个答案: