wagnerandrade / upper-box

API javascript para ser usada junto com jquery que transforma elementos em "caixas moveis".

This URL has Read+Write access

upper-box / example.html
100644 45 lines (38 sloc) 1.33 kb
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
      <title>upper-box Example Page</title>
      <script type="text/javascript" src="lib/jquery.js"></script>
      <script type="text/javascript" src="upper-box.js"></script>
      <style type="text/css">
          .divClass
          {
            background-color: white;
            border: 2px solid silver;
            padding: 5px;
          }
          
          #div2
          {
            width: 300px;
          }
          
          #upper-box-knob
          {
            background-color: silver;
          }
      </style>
  </head>
  <body>
    
    <h1>upper-box</h1>
    
    <div id='div1' class='divClass'>
      <h2>Olá,</h2>
      <p>Esta div não é um <b>upper-box</b>!</p>
      <p>Aproxime seu mouse da extremidade superior da tela do navegador para ver um.</p>
    </div>
  
    <div id='div2' class='divClass upper-box'>
      <p>Esta div será um <b>upper-box</b>!</p>
      <p>Simples, não?!</p>
    </div>
    
    <p>Mais em [<a href="http://www.wagnerandrade.com/blog/2008/07/upper-box-componente-para-jquery/">http://www.wagnerandrade.com/blog/2008/07/upper-box-componente-para-jquery/</a>].</p>
    
  </body>
</html>