我需要在这个jquery代码中更改字体类型和权重

时间:2016-11-28 19:41:36

标签: jquery wordpress

我不知道jquery是如何工作的,但是我有这个wordpress插件工作得很好,并且完全符合我的要求。事实上,我想定制“Stream Live!”提示一下。

以下是代码:

(function ($) {
    $(document).ready(function ($) {

        $.ajax({
            type: 'GET',
            url: 'https://api.twitch.tv/kraken/streams/' + marctvtwitchsettings.channelname,
            headers: {
                'Client-ID': 'c63pi9xlfs7bqtt0h9otarutq6nc1h1'
            },
            success: function (a) {
                if (a.stream) {
                    var submenu = '';

                    if (marctvtwitchsettings.showmeta == 'on') {
                        var submenu = '<ul class="sub-menu"><li class="menu-item twitch-meta">' +
                            '<a class="twitch-link" target="_blank" title="' + a.stream.viewers + ' viewers" href="' + marctvtwitchsettings.channelurl + '">' +
                            '<p>' + a.stream.game + '</p>' +
                            '<img src="' + a.stream.preview.medium + '"></li></ul>' +
                            '</a>';
                    }

                    $(marctvtwitchsettings.menuselector).append('<li id="twitch-status" class="twitch-status menu-item">' +
                        '<a class="twitch-link" target="_blank" title="' + a.stream.viewers + ' viewers" href="' + marctvtwitchsettings.channelurl + '">Stream Live!</a>' +
                        submenu +
                        '</li>');
                    $('.offline', marctvtwitchsettings.menuselector).hide();
                }
            }
        });
    });
})(jQuery);

如何制作“Stream Live!”胆大?如何更改字体系列?

3 个答案:

答案 0 :(得分:1)

你可以试试这个:

(function ($) {
$(document).ready(function ($) {

    $.ajax({
        type: 'GET',
        url: 'https://api.twitch.tv/kraken/streams/' + marctvtwitchsettings.channelname,
        headers: {
            'Client-ID': 'c63pi9xlfs7bqtt0h9otarutq6nc1h1'
        },
        success: function (a) {
            if (a.stream) {
                var submenu = '';

                if (marctvtwitchsettings.showmeta == 'on') {
                    var submenu = '<ul class="sub-menu"><li class="menu-item twitch-meta">' +
                        '<a class="twitch-link" target="_blank" title="' + a.stream.viewers + ' viewers" href="' + marctvtwitchsettings.channelurl + '">' +
                        '<p>' + a.stream.game + '</p>' +
                        '<img src="' + a.stream.preview.medium + '"></li></ul>' +
                        '</a>';
                }

                $(marctvtwitchsettings.menuselector).append('<li id="twitch-status" class="twitch-status menu-item">' +
                    '<a class="twitch-link" style="font-weight: bold; font-family: Consolas,"courier new";" target="_blank" title="' + a.stream.viewers + ' viewers" href="' + marctvtwitchsettings.channelurl + '">Stream Live!</a>' +
                    submenu +
                    '</li>');
                $('.offline', marctvtwitchsettings.menuselector).hide();
            }
        }
    });
});
})(jQuery);

答案 1 :(得分:0)

它有类.twitch-link,所以你只需要设置该类的样式。正确的做法是将这些规则添加到CSS中,但您也可以使用style=属性进行内联。

.twitch-link {
    font-family: 'Arial';
    font-weight: bold;
}

或内联版本:

<a class="twitch-link" style="font-family: 'Arial'; font-weight: bold;" target="_blank" title="' + a.stream.viewers + ' viewers" href="' + marctvtwitchsettings.channelurl + '">Stream Live!</a>

答案 2 :(得分:0)

这应该可以选择此特定链接并将其设为粗体。

$('a:contains("Stream Live!")').css({"font-weight":"bold"});

对于解释......可能有点长。
但您可以先阅读herehere

您可以在.css()方法中放置许多其他CSS规则,如下所示:

.css({"font-weight":"bold","font-size":"2em","text-decoration":"none","color":"red"});