Использование собственного шрифта для кнопки

Question

Использование собственного шрифта для кнопки

0

В настоящее время я работаю над пользовательским шрифтом, который добавляет функции с помощью кнопок для Cookie Clicker. Я почти закончил, но мне бы хотелось, чтобы шрифт игры использовался как шрифт кнопки, но я не знаю, как это сделать, я знаю, что это возможно, поскольку я видел это около двух лет назад, но я не могу вспомнить, где. Шрифт, который я хочу использовать, это "font-family: \" Kavoon\""

Часть соответствующего сценария выглядит следующим образом:

function addStyleSheet() {
    var stylesClassName = options.panelId + '-styles';
    var styles = document.getElementsByClassName(stylesClassName);
    if (styles.length <= 0) {
        styles = document.createElement('style');
        styles.type = 'text/css';
        styles.className += ' ' + stylesClassName;
        styles.font = superFont
        document.body.appendChild(styles);
    }
    var css = '#' + options.panelId + '{position:fixed;top:0;right:0;background:#000;color:#fff;padding:5px;z-index:9999;}#' + options.panelId + ' button{margin-left: 5px;}#' + options.panelId + ' button.active:after{content:"*";color:red;}';
    styles[(typeof document.body.style.WebkitAppearance == "string") ? "innerText" : "innerHTML"] = css;
}

и вот пример того, как одна из кнопок задана так:

var options = {
    panelId: 'cookie-cheater',
    intervalDelay: 1,
    buttons: {
        'bigCookie': {
            label: 'Autoclick Big Cookie',
            action: function () {
                toggleAutoAction('bigCookie', function () {
                    Game.ClickCookie();
                })
            }
        }

Я был бы очень признателен, если бы кто-нибудь мог придумать какие-то идеи или решение!

Спасибо, Даниэль

.....................................................................................................................................................................

EDIT: СОВЕРШЕННО! вытащил allnighter, чтобы сделать это, и я закончен, я многому научился и закончил свое собственное решение, пожалуйста, если вы находитесь в той же ситуации, что и я, используйте обновленный метод, который Брок Адамс опубликовал на Ravi Hamsa post,

Спасибо всем вам за вашу помощь! Даниил

Daniel Jochem 23 сен. 2013, в 10:25

Источник

Теги:

javascript

html

css

fonts

userscripts

2 ответа

2

Чтобы использовать ваш шрифт, вы должны указать веб-шрифт. Быстрый поиск Google дал ваш точный шрифт (хорошие новости): http://www.google.com/fonts/specimen/Kavoon

Сначала поместите это в свой элемент <head>. Это указывает браузеру загрузить шрифт на локальный компьютер, чтобы использовать его на своей веб-странице.

<link href='http://fonts.googleapis.com/css?family=Kavoon' rel='stylesheet' type='text/css'>

Затем выберите свой элемент и добавьте к нему семейство шрифтов.

.my-btn {
  font-family: 'Kavoon', cursive;
}

SamT 23 сен. 2013, в 05:22

Ещё вопросы

Ravi Hamsa · Accepted Answer · 2013-09-23T05-44-00.000Z

Добавьте эту строку в свой тег.

<link href='http://fonts.googleapis.com/css?family=Kavoon' rel='stylesheet' type='text/css'>

это сделает "Kavoon" готовым к использованию на вашей странице, тогда вы можете использовать font-family:Kavoon в вашем стиле.

Обновление. Чтобы добавить <link> в среду имен, используйте этот код:

var D           = document;
var linkNode    = D.createElement ('link');
linkNode.type   = "text/css";
linkNode.rel    = "stylesheet";
linkNode.href   = "http://fonts.googleapis.com/css?family=Kavoon";

var targ = D.getElementsByTagName ('head')[0] || D.body || D.documentElement;
targ.appendChild (linkNode);

Затем активируйте стиль с помощью кода следующим образом:

GM_addStyle ("button {margin-left: 5px; font-family: 'Kavoon', cursive;}");

Фактически, вы должны использовать GM_addStyle(), который поддерживается всеми основными механизмами usercript, а не addStyleSheet().

Спасибо, это действительно помогло бы, и поможет другим в этой ситуации, но я закончил, прежде чем увидел это извините. Я отредактирую свой пост, чтобы сказать им, чтобы он использовал этот метод, потому что мне не очень нравится мой метод, он немного грязный. Спасибо!