私が抱えている問題は、 jQuery を介して cssプロパティを適用するときborder-radius
に aが削除されることです。半径を持つは、配置された も切り取っています。以下に例を示します。<div/>
width
<div/>
absolute
<div/>
Twitter で機能する同様の例を次に示します (最初にログインします): https://twitter.com/welcome/recommendations
ブラウザのバージョン: Chrome 26.0.1410.65
#SuggestProgressContainer {
height: 27px;
float: left;
margin: 4px 20px 0 0;
position: relative; top: 0; left: 0;
width: 247px;
overflow: hidden;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}
#SuggestProgressBar {
width: 247px;
height: 27px;
background: #c6c6c6;
border: 1px solid #bfbfbf;
position: absolute; top: 0; left: 0;
}
#SuggestProgress {
height: 100%;
width: 50px;
position: absolute; top: 0; left: 0;
border: 1px solid #068CE1;
background: #0F93E7;
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#1c9dee), to(#068ce1));
background: -webkit-linear-gradient(top, #1c9dee, #068ce1);
background: -moz-linear-gradient(top, #1c9dee, #068ce1);
background: -ms-linear-gradient(top, #1c9dee, #068ce1);
background: -o-linear-gradient(top, #1c9dee, #068ce1);
-webkit-transition: width 230ms ease-out;
-moz-transition: width 230ms ease-out;
-ms-transition: width 230ms ease-out;
-o-transition: width 230ms ease-out;
transition: width 230ms ease-out;
}
#ProgressText {
position: absolute;
top: 5px;
left: 10px;
font-size: 11px;
font-weight: 700;
color: #fff;
text-shadow: 0 -1px rgba(0,0,0, .15);
}