Cufon이 버튼에서 작동하도록 할 수 있습니까?

Question

그래서 지금 나는 머리를 강타하고 있습니다. 현재 우리는 버튼에 요소를 사용하여 자신의 커스텀 글꼴을 제공합니다. Cufon이 버튼에서 작업 할 수 있는지 궁금합니다.

지금까지 나는 버튼을 변경하고 '입력'또는 '입력 [type = "제출"] 요소에서 표준 CSS 스타일을 사용하여 버튼을 사용했습니다. 그러나 Cufon 에서이 두 가지를 모두 사용하지 않았습니다.

이것은 버튼입니다. 그래서 Cufon은 이미지를 생성함에 따라 작동해야하지만 작동해야 할 수도 있습니다. 누구든지 도와 줄 수 있습니까?

Answer 1

다음 방법으로 요소 사용 :

<button type="buton">value</button>

Cufon 스타일을 적용 할 때 작업 :

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

매우 감사합니다 :)

Answer 2

$('.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 비활성화 된 '제출'입력으로 돌아갑니다.

Answer 3

Cufon과 함께 일할 방법이 없다고 생각합니다. <input type="submit" />. 주된 이유는 캔버스를 삽입 할 곳이 없기 때문입니다 ...

그러나 당신은 단순히 더 의미 적으로 맞는 곳으로 전환 할 수 있습니다. <button>, 그것은 폐쇄가 필요합니다 </button> 따라서 캔버스를위한 장소를 만듭니다.

하지만 IE7 이하의 경우 양식을 제출하지 않으므로 유형을 지정하십시오. 또한 유형을 지정하면 모든 브라우저 전체에서 균일 한 동작으로 이어지는 것 같습니다.

위의 도움이된다면 알려주세요! 건배

Answer 4

Cufon을 사용하는 유일한 해결책 <input type="submit"/> 버튼은 JavaScript (jQuery 개인적으로)를 사용하는 것이 었습니다.

1. 입력 버튼의 텍스트 ( "값"속성)를 스팬으로 복사하십시오.
2. cufon.replace ()를 사용하여 스팬을 교체하십시오.
3. 입력 버튼의 텍스트를 제거하십시오
4. 버튼 위에 스팬을 배치하십시오
5. 클릭 () 이벤트를 스팬에서 버튼으로 전파합니다.

완료 !