Cufon をボタンで動作させることはできますか?

StackOverflow https://stackoverflow.com/questions/1315771

質問

それで今、私は頭をぶつけています - 現時点では、ボタンの要素を使用して独自のカスタムフォントを与えていますが、問題ありません - これは機能しますが、サイトの残りの部分で Cufon を使用しているため、 Cufon をボタンで動作させることができるかどうか疑問に思っています。

これまでのところ、ボタンを に変更し、「input」または「input[type="submit"]」要素で標準の CSS スタイルを使用すると正常に機能しますが、cufon でこれらの両方を試してみましたが無駄でした。

これはボタンです - Cufon が画像を生成するので、これは機能するはずですが、おそらく私のやり方が間違っています - 誰か助けてくれますか?

役に立ちましたか？

解決 2

次のように要素を使用します：

<button type="buton">value</button>
Cufonスタイルを適用するときに

勤務ます：

Cufon.replace('button', {color: '-linear-gradient(#999, 0.45=#666, 0.45=#555, #999)'});

どうもありがとうございました：）

他のヒント

$('.input-button').each(function(){
    $(this).hide().after('<span class="input-button">').next('span.input-button').text($(this).val()).click(function(){
        $(this).prev('input.input-button').click();
    });
});

私は私がcufonを使用することができますスパン、に私の入力値をコピーするために上記のコードを使用していました。それは素晴らしい作品と、まだバックJavaScriptを無効にして入力「を提出する」に落ちます。

私は<input type="submit" />でCufon仕事をする方法はありません信じています。 キャンバスを挿入する場所がないということで主な理由...

しかしあなたは、単に、より意味的にフィット<button>にその必要性閉鎖</button>を切り替えることができ、したがって、キャンバスのための場所を作成します。

非常に重要な、しかし、そうでない場合は、以下のIE7とは、フォームを送信しませんので、あなたは、同様にそれと型を指定してください。また、タイプを指定すると、すべてのブラウザ全体で均一な行動につながると思われます。

上記の助けなら、私を知ってみましょう！ 乾杯

Cufonを使用するために私が見つけた唯一の解決策 <input type="submit"/> ボタンは Javascript (個人的には jQuery) を使用していました。

  1. 入力ボタンのテキスト (「value」属性) を scan にコピーします。
  2. Cufon.replace() を使用してスパンを置き換えます
  3. 入力ボタンのテキストを削除する
  4. スパンをボタンの上に配置します
  5. click() イベントをスパンからボタンに伝播します。

終わり ！

ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top