Можно ли заставить Cufon работать по кнопке?

Question

Итак, прямо сейчас я ломаю голову - в данный момент мы используем элемент для кнопки, чтобы присвоить ей собственный шрифт, хорошо - это работает, но поскольку мы используем Cufon на остальной части сайта, мы интересно, можно ли заставить Cufon работать с кнопкой.

До сих пор я изменил кнопку на и использование стандартных стилей CSS для элемента «input» или «input[type="submit"]» работало нормально, но я пробовал оба из них в 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. Скопируйте текст кнопки ввода (атрибут «value») в диапазон.
2. Замените диапазон с помощью Cufon.replace().
3. Удалить текст кнопки ввода
4. Расположите диапазон над кнопкой
5. Распространите событие click() из диапазона на кнопку.

Сделанный !