html 5学習(1)
2642 ワード
1.asideラベルは、リンク、用語表、または引用文を配置するのに最適な場所である記事関連の追加コンテンツを表示するために使用されます.
2.要素を使用して進捗バーを実装します.
すべてのブラウザがラベルと互換性があるわけではありません.
ステップ1:ブラウザがラベルをサポートしているかどうかを検出し、ラベルを作成してmax属性を検出し、その属性を検出できるかどうかを判断します.検出できない場合は、ブラウザがラベルをサポートしていないことを示します.
第2のステップでは、jqueryは要素を作成します.
3.
2.
<meter id="pledge_goal" value="2000" min="0" max="4000" title="usd"></meter>
すべてのブラウザが
ステップ1:ブラウザが
var noMeterSupport = function(){
return(document.creatElement('meter').max === undefined);
}第2のステップでは、jqueryは要素を作成します.
if(noMeterSupport){
var fakeMeter,fill,label,labelText,max,meter,value;
meter = $("#pledge_goal");
value = meter.attr("value");
max = meter.attr("max");
labelText = "$"+meter.val();
fakeMeter = $("<div></div>");
fakeMeter.addClass("meter");
lable = $("<span>"+labelText+"</span>");
label.addClass("label");
fill = $("<div></div>");
fill.addClass("fill");
fill.css("width",(value/max*100)+"%");
fill.append("<div style='clear:both;'><br></div>");
fakeMeter.append(fill);
fakeMeter.append(label);
meter.replacewith(fakeMeter);
}.meter{border:1px solid #000;display:block;position:relative;width:500px;}
.fill{background-color:#693;}
.label{position:absolute;right:0;top:0;z-index:1111;}
3.