"Fossies" - the Fresh Open Source Software Archive

Member "pmd-src-6.47.0/docs/tooltips.html" (25 Jun 2022, 2723 Bytes) of package /linux/misc/pmd-src-6.47.0.zip:


As a special service "Fossies" has tried to format the requested source page into HTML format using (guessed) HTML source code syntax highlighting (style: standard) with prefixed line numbers. Alternatively you can here view or download the uninterpreted source code file.

    1 ---
    2 layout: none
    3 search: exclude
    4 ---
    5 
    6 <html>
    7 <head>
    8 <title> Tooltip Demo</title>
    9 <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
   10 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
   11 <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
   12 
   13 <script type="text/javascript">
   14 $(document).ready(function(){
   15 
   16 /*Bootstrap popovers are initialized with the following script. In the options, I'm setting the placement to be on the right, the trigger to be hover rather than click, and to allow HTML from the JSON data source. */
   17 
   18     $('[data-toggle="popover"]').popover({
   19         placement : 'right',
   20         trigger: 'hover',
   21         html: true
   22     });
   23 
   24 /* Set the location where mydoc_tooltips_source.json is. */
   25 var url = "tooltips.json";
   26 
   27 $.get( url, function( data ) {
   28 
   29  /* Bootstrap popover text is defined inside a data-content attribute inside an element. That's 
   30  why I'm using attr here. If you just want to insert content on the page, use append and remove the data-content argument from the parentheses.*/
   31 
   32     $.each(data.entries, function(i, page) {
   33         if (page.doc_id == "basketball") {
   34             $( "#basketball" ).attr( "data-content", page.body );
   35         }
   36 
   37         if (page.doc_id == "baseball") {
   38             $( "#baseball" ).attr( "data-content", page.body );
   39         }
   40         if (page.doc_id == "football") {
   41             $( "#football" ).attr( "data-content", page.body );
   42         }
   43 
   44         if (page.doc_id == "soccer") {
   45             $( "#soccer" ).attr( "data-content", page.body );
   46         }
   47 
   48 
   49         });
   50     });
   51 
   52  
   53 });
   54 </script>
   55 
   56 <style>
   57 body {padding-left:50px;}
   58 </style>
   59 
   60 </head>
   61 <body>
   62 
   63 <h1>Tooltip Demo</h1>
   64 
   65 <p>This page is purposely separated out from the rest of theme so you can see the bare minimum code to add to a page, without all the other theme's code getting in the way.</p>
   66 
   67 <p>Content in the tooltips (actually "popovers" according to Bootstrap lingo) can be pulled in dynamically by placing the JSON file on a remote host. </p>
   68 
   69 <div class="alert alert-info" role="alert"><b>Note:</b> Make sure you view the file source so you can read the notes I've added in code comments.</div>
   70 
   71 <!-- the glyphicon class provides the info icon.-->
   72 
   73 <p>Basketball <span class="glyphicon glyphicon-info-sign" id="basketball" data-toggle="popover"></span></p>
   74 
   75 <p>Baseball <span class="glyphicon glyphicon-info-sign" id="baseball" data-toggle="popover"></span></p>
   76 
   77 <p>Football <span class="glyphicon glyphicon-info-sign" id="football" data-toggle="popover"></span></p>
   78 
   79 <p>Soccer <span class="glyphicon glyphicon-info-sign" id="soccer" data-toggle="popover"></span></p>
   80