TOP / ボタン
- 1 2 >>

2012年01月24日

Firefoxのボタンの囲み点線を消去。css

スポンサード　リンク

 ::-moz-focus-inner

button

 Firefoxではボタンをクリックすると上のように囲み点線が現れます。
ＩＥではボタンの枠線の内側に添って出るのでそれほど気にならないのですが.........。
この点線を消去するスタイルシートです。（Firefox）

ロリポップ！のドメインは選べる全８５種類！！
☆さくらのレンタルサーバ ビジネスプロ☆

サンプルソース

<html>
 <head>
<title>Firefoxのボタンの囲み点線を消去。</title>
 <style type="text/css">
<!--

       /* Firefoxのボタンの点線を消す */
  input[type="button"]::-moz-focus-inner,
  input[type="reset"]::-moz-focus-inner,
  input[type="submit"]::-moz-focus-inner {
     border: 0px;
      }
-->
</style>
</head>
<body>
  <form>
    <input type="button" value="点線を消したボタン">
  </form>
</body>
</html>
::-moz-focus-innerの値
 border: 0px;は border-style: none; もしくは border-color: transparent;と
書いてもＯＫです。
border-style: none;
border-color: transparent;

ロリポップ！のドメインは選べる全８５種類！！
☆さくらのレンタルサーバ ビジネスプロ☆
ボタン
borderプロパティ css
border-styleプロパティ; ボーダーのスタイルの設定
角丸吹き出しポップアップ CSS

タグ：-moz-focus-inner
posted by javaScript at 20:53 | 大阪 ☁ | ボタン | このブログの読者になる | 更新情報をチェックする

2009年06月30日

ボタンのラベルを点滅させます。

スポンサード　リンク

ボタンを押すとラベルが点滅します。
もう一度押すと止まります。

サンプルソース

<html>
<head>
<title>ボタンのラベルを点滅させます</title>
<script language="JavaScript">
<!--
msg = new Array();
msg[0] = "ようこそ Ｊａｖａｓｃｒｉｐｔ スタイルシート サンプル集 へ!!";
msg[1] = " 　　 ";　//空白の文字列

num = 0;
flag = false;
var tmrID;

function blinkmsg(){
flag = !flag; //トグルスイッチ trueとfalseの切り替え ! 否定演算子
if(flag == true) blinkmsg1();
else stp ();
}

function blinkmsg1(){ //ボタンのラベル（文字）を点滅させます。
document.getElementById("mybotan").value = msg[num];
num ^= 1; // 0と1の切り替え ^ 排他的論理和
tmrID = setTimeout('blinkmsg1()',1000); //点滅の間隔（単位は千分の一秒）
}

function stp(){　//文字の点滅を止めます。
clearTimeout(tmrID); // tmrID をクリアします
document.getElementById("mybotan").value =" スタート"; //ラベルの値を" スタート"にします
};
//-->
</script>

</head>
<body>
<form>
<input type="button" id="mybotan" value=" スタート" onclick="blinkmsg()"
style="width : 400px;text-align : center;">
</form>
</body>
</html>

文字 点滅
トグルスイッチ（０と１、trueとfalseを切り替え）条件分岐
ボタンのラベルがスクロールします。
文字がフェードイン,フェードアウトします

タグ：javascript ボタン ラベル
posted by javaScript at 18:51 | 大阪 ☁ | ボタン | このブログの読者になる | 更新情報をチェックする
- 1 2 >>
×

この広告は90日以上新しい記事の投稿がないブログに表示されております。