Project

General

Profile

Statistics
| Branch: | Revision:

colonymech / docs / www / colonyscout / internal / editText / demo / demo.htm @ f59acf11

History | View | Annotate | Download (2.72 KB)

1
<!DOCTYPE html>
2
<html>
3
<head>
4
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
5
    <title>jQuery editableText demo</title>
6

    
7
    <link href="/internal/css/internal.css" rel="stylesheet" type="text/css">        
8
        <!-- We will use jQuery hosted by Google-->
9
    <script src="/internal/js/jquery.min.js" type="text/javascript"></script>        
10
    <script src="/internal/js/jquery.editableText.js" type="text/javascript"></script>        
11
        <script>
12
                jQuery(function($){
13
            $('h1.editableText, p.editableText').editableText({
14
                                newlinesEnabled: false
15
                        });
16
                        
17
                        $.editableText.defaults.newlinesEnabled = true;
18

19
                        $('div.editableText').editableText();
20
                        
21
                        $('.editableText').change(function(){
22
                                var newValue = $(this).html();
23
                        });
24
        });
25
        </script>
26
        <style>
27
                body {
28
                        background: #343434;
29
                }
30
                .centered {
31
                        margin: 0 auto;
32
                        width: 450px;
33
                        padding: 50px;
34
                        background: #fff;
35
                        border: 1px solid gray;
36
                }
37
        </style>        
38
</head>
39
<body>
40
        <div class="centered">
41
                <p><a href="http://valums.com">Back to "editable text" plugin</a></p>
42
                
43
            <h1 class="editableText">jQuery plugin development is fun and easy</h1>
44
            <p class="editableText">This is a demo of editableText jQuery plugin. 
45
                You can't add newlines to this paragraph.</p>
46
                        
47
                <div class="editableText">
48
                        <p>
49
                                Most turtles that spend most of their life on land have their eyes looking down at objects in front of them. Some aquatic turtles, such as snapping turtles and soft-shelled turtles, have eyes closer to the top of the head. These species of turtles can hide from predators in shallow water where they lie entirely submerged except for their eyes and nostrils. Sea turtles possess glands near their eyes that produce salty tears that rid their body of excess salt taken in from the water they drink.
50
                        </p>
51
                        
52
                        <p>
53
                                Turtles are thought to have exceptional night vision due to the unusually large number of rod cells in their retinas. Turtles have color vision with a wealth of cone subtypes with sensitivities ranging from the near Ultraviolet (UV A) to Red. Some land turtles have very poor pursuit movement abilities, which are normally reserved for predators that hunt quick moving prey, but carnivorous turtles are able to move their heads quickly to snap.
54
                        </p>
55
        
56
                        <p>
57
                                Turtles have a rigid beak. Turtles use their jaws to cut and chew food. Instead of teeth, the upper and lower jaws of the turtle are covered by horny ridges. Carnivorous turtles usually have knife-sharp ridges for slicing through their prey. Herbivorous turtles have serrated-edged ridges that help them cut through tough plants. Turtles use their tongues to swallow food, but they cannot, unlike most reptiles, stick out their tongues to catch food.
58
                        </p>
59
                </div>
60
        </script>
61
</head>