Question

我正在使用现有javascript的模板。移动菜单“图标”实际上是一个包含“MENU”字样的下拉菜单。在我看来，这是旧式，我想将其更改为移动菜单的标准3条。

提出这个问题的javascript部分是：

if ($nav.is('ul,ol')) {

    if (settings.header) {
      $select.append(
        $('<option/>').text('MENU')
      );
    }

是否可以添加.src（“img / mobilemenubars.png”）或此类效果来替换.text（'MENU'）部分？我可以提供整个JavaScript，但我不确定是否有必要。或者是吗？

Answer 1

您可以使用unicode字符和Font Awesome字体系列来完成。 Here is a DEMO

以下是unicode图标的Font Awesome cheat sheet

select {
  font-family: FontAwesome;
}

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
  <title>JS Bin</title>
</head>

<body>
  <select>
    <option>&#xf0c9; Menu</option>
    <option>&#xf040; Pencil</option>
    <option>&#xf072; Vacation</option>
  </select>
</body>

</html>

将图像文件添加到现有的javascript中

1 个答案: