我可以使用 Greasemonkey 和 jQuery 将适当的笑脸或图像放入页面吗？

Question

我正在编写一个带有笑脸的脚本。我没有使用网络服务器将笑脸上传为 .png 的选项。
怎样才能让笑脸的位置方向正确？

$("#breadcrumbContainer").append("<span class='rcs1' style='float:right;cursor:pointer;margin-right:5px;background-color:lime'>:-)</span>");

Answer 1

Unicode 提供指向正确方向的笑脸

U+236A 为“☺”

你也可以使用 "kaomoji" 如果你想变得花哨，例如：

(⌒▽⌒)☆
(^▽^)
(★^O^★)
｡◕‿◕｡
(◑‿◐)

Answer 2

您还可以将 Font-Awesome 添加到您的项目中，您只需要做：

$("#breadcrumbContainer").append('<i class="fa fa-smile-o"/>');

Answer 3

将纯 ASCII :-) 放入旋转的块元素中：

$("#breadcrumbContainer").append(
     '<div style="transform: rotate(0.25turn); width:1em; height:1em">:-)</div>'
);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<div id="breadcrumbContainer">Test</div>

为了使其更通用，将 CSS 样式放入一个单独的块中（您可以使用 GM_addStyle 函数）并为实验添加供应商别名 transform 属性 : -webkit-transform,
-moz-transform 等等。

Answer 4

您可以尝试使用 Webdings 和 Wingdings 字体来使用笑脸。它包含许多可用于网络的图像。（或者你可以使用unicode）下面是截图；

除此之外，还有一个简单的解决方案供您使用。将您的图片上传到图片托管服务，例如 imgur (the one Whosebug uses), and you can get a direct link to your images like http://i.stack.imgur.com/CaReM.png 。使用此 url 在您的网页中放置图像。

你也可以看看;

HTML Decimal Code & Unicode Hexadecimal Code for iOS and Safari Emoticons

和

Emoji Unicode Tables

希望对您有所帮助。

Answer 5

您可以使用适当的笑脸，或您喜欢的任何图像，不需要服务器。

使用GM_getResourceURL^Doc。唯一的技巧是在安装之前将所需的图像保存在与 *.user.js 文件相同的文件夹中。（或者甚至在之后，如果您精通 Firefox 配置文件文件夹。）

例如：

将此代码保存为InsImage.user.js:

// ==UserScript==
// @name        _Insert any smiley, or any image using Greasemonkey
// @match       http://whosebug.com/questions/*
// @require     http://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js
// @resource    mySmiley Pn708.png
// @grant       GM_getResourceURL
// ==/UserScript==

$('<img>').appendTo ("#question-header > h1 > a.question-hyperlink")
.attr ('src', GM_getResourceURL ("mySmiley") )
;

放在你方便的文件夹里。

现在将此图片下载到同一文件夹：
http://i.stack.imgur.com/Pn708.png (link)
打开该文件夹并将 InsImage.user.js 拖放到 Firefox 上（或者 Chrome 安装了 Tampermonkey）。
按照提示安装脚本。图片会自动复制过来。
成功！

我可以使用 Greasemonkey 和 jQuery 将适当的笑脸或图像放入页面吗？

Can I put a proper smiley, or image, into a page using Greasemonkey and jQuery?

javascript

css

jquery

greasemonkey