jQuery:labelOver(水印)示例代码

时间:2010-04-29 15:35:31

标签: jquery

有人有工作样本吗? - 谢谢

2 个答案:

答案 0 :(得分:0)

我假设你在谈论this jQuery插件。有working demo的链接。

答案 1 :(得分:0)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html lang="en">
  <head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
    <title>labelOver Example</title>
    <style type="text/css" media="screen">
    <!--
      BODY { margin: 10px; padding: 0; font: 1em "Trebuchet MS", verdana, arial, sans-serif; }
      BODY { font-size: 100%; }
      H1 { margin-bottom: 2px; font-family: Garamond, "Times New Roman", Times, Serif;}
      DIV.container { margin: auto; width: 90%; margin-bottom: 10px;}
      TEXTAREA { width: 80%;}
      FIELDSET { border: 1px solid #ccc; padding: 1em; margin: 0; }
      LEGEND { color: #ccc; font-size: 120%; }
      INPUT, TEXTAREA { display: block; clear: left; font-family: Arial, verdana; font-size: 125%; padding: 7px; border: 1px solid #999; margin: 10px; }
      #f DIV.label { position: relative; float: left; margin-right: 3px; clear: left; }
      DIV.clear { clear: both; }
      LABEL.over { color: #ccc; position: absolute; top: 20px; left: 20px;}
    -->
    </style>

    <link rel="stylesheet" type="text/css" href="/master.css" />
    <script src="/js/jquery.js" type="text/javascript"></script>
    <script src="label_over.js" type="text/javascript" charset="utf-8"></script>

    <script type="text/javascript">
    <!--
      $(function() {
        $('#f').submit(function() {
          $('legend', this).html('Example with labelOver');
          $('label').labelOver('over');
          return false;
        })
        $('label.pre').labelOver('over');
      })
    //-->
    </script>
  </head>
  <body id="page">
    <div id="doc">
        <h1>labelOver Example</h1>
        <form action="" id="f">
          <fieldset>
            <legend>Example without labelOver</legend>
            <div class="label">
            <label class="pre" for="applied">Applied</label>
            <input type="text" name="applied" value="" id="applied" />
            </div>
            <div class="label">
            <label for="search">Search</label>
            <input type="text" name="search" value="" id="search" />
            </div>
            <div>
            <input type="submit" name="submit" value="Apply label over" id="submit" />
            </div>
            <div class="clear"></div>
          </fieldset>
        </form>
    </div>
  </body>
</html>