← Back to branch summary

~ubuntu-branches/ubuntu/utopic/codemirror-js/utopic

« back to all changes in this revision

Viewing changes to demo/matchhighlighter.html

  • Committer: Package Import Robot
  • Author(s): David Paleino
  • Date: 2012-04-12 12:25:28 UTC
  • Revision ID: package-import@ubuntu.com-20120412122528-8xp5a8frj4h1d3ee
Tags: upstream-2.23
Import upstream version 2.23

Show diffs side-by-side

added added

removed removed

Lines of Context:
demo/matchhighlighter.html
 
1
<!doctype html>
 
2
<html>
 
3
  <head>
 
4
    <title>CodeMirror: Match Highlighter Demo</title>
 
5
    <link rel="stylesheet" href="../lib/codemirror.css">
 
6
    <script src="../lib/codemirror.js"></script>
 
7
    <script src="../lib/util/searchcursor.js"></script>
 
8
    <script src="../lib/util/match-highlighter.js"></script>
 
9
    <link rel="stylesheet" href="../doc/docs.css">
 
10
 
 
11
    <style type="text/css">
 
12
      .CodeMirror {border-top: 1px solid black; border-bottom: 1px solid black;}
 
13
          
 
14
      span.CodeMirror-matchhighlight { background: #e9e9e9 }
 
15
      .CodeMirror-focused span.CodeMirror-matchhighlight { background: #e7e4ff; !important }
 
16
    </style>
 
17
  </head>
 
18
  <body>
 
19
    <h1>CodeMirror: Match Highlighter Demo</h1>
 
20
 
 
21
    <form><textarea id="code" name="code">Select this text: hardToSpotVar
 
22
        And everywhere else in your code where hardToSpotVar appears will automatically illuminate.
 
23
Give it a try!  No more hardToSpotVars.</textarea></form>
 
24
 
 
25
    <script>
 
26
var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
 
27
  lineNumbers : true,
 
28
  onCursorActivity: function() {
 
29
    editor.matchHighlight("CodeMirror-matchhighlight");
 
30
  }
 
31
});
 
32
</script>
 
33
 
 
34
    <p>Highlight matches of selected text on select</p>
 
35
 
 
36
  </body>
 
37
</html>