javascript - 如何创建具有自定义插入符号和文本行为的输入文本字段？

Question

最近访问了一个壁纸分享网站 wallbase 。我首先注意到的是搜索框。文本输入框有一个漂亮的 css 渐变样式。但更有趣的是它的文本输入插入符号的行为。它是白色的，明亮的，有光泽的。此外，输入文本的行为也是自定义的。

我不知道它是如何实现的，我认为它可能与 CSS 和 JavaScript 一起实现。有人可以解释它的实现方式吗？我在下面附上截图:

Answer 1

这个插件可以帮助你Fancy Input – JQuery Plugin

<!-- ...previous page content... -->
<div>
 <input type='text' >
</div>
<div>
  <textarea></textarea>
</div>
<!-- ...some more content (hopefully)... -->
<script>
 $('div :input').fancyInput();
</script>

"Call the .fancyInput() function on all parents of inputs. With this example code, make sure every input is wrapped in a div."