diff options
| author | Ca-Phun Ung <pazu2k@gmail.com> | 2008-12-30 08:37:44 +0000 |
|---|---|---|
| committer | Ca-Phun Ung <pazu2k@gmail.com> | 2008-12-30 08:37:44 +0000 |
| commit | 84e9175a68b0e342a270c448bdfedb22e5d0ac43 (patch) | |
| tree | c88f2b66b3753dfe927b86effbe48fd89409f18d /demos/index.html | |
| parent | 182b227081af437d538a494b70c55c051e8b9faa (diff) | |
| download | jquery-ui-84e9175a68b0e342a270c448bdfedb22e5d0ac43.tar.gz jquery-ui-84e9175a68b0e342a270c448bdfedb22e5d0ac43.zip | |
modified demos/index.html so it loads content via ajax to match functionality of website demos. still need to fix-up css and markup to match filament's static example.
Diffstat (limited to 'demos/index.html')
| -rw-r--r-- | demos/index.html | 51 |
1 files changed, 39 insertions, 12 deletions
diff --git a/demos/index.html b/demos/index.html index 281924f46..9ac37e086 100644 --- a/demos/index.html +++ b/demos/index.html @@ -17,7 +17,30 @@ <script type="text/javascript" src="../ui/ui.slider.js"></script> <script type="text/javascript" src="../ui/ui.sortable.js"></script> <script type="text/javascript" src="../ui/ui.tabs.js"></script> - + <script type="text/javascript"> + jQuery(function($){ + $('.left-nav a').click(function(ev){ + var section = this.href.replace('/index.html',''); + $('td.normal div.normal') + .empty() + .append('<h4 class="demo-subheader">Functional demo:</div>') + .append('<div id="demo-config"></div>') + .find('#demo-config') + .append('<iframe id="demo-frame" name="demo-frame" width="520" height="314" scrolling="auto" frameborder="0" src="'+ section +'/default.html"></iframe><div id="demo-config-menu"></div>') + .find('#demo-config-menu') + .load(this.href, function(){ + $('#demo-config-menu a').each(function(){ + this.setAttribute('href', section + '/' + this.getAttribute('href')); + $(this).attr('target', 'demo-frame'); + }); + }) + .end() + .end() + ; + ev.preventDefault(); + }); + }); + </script> </head> <body> <?php } else { @@ -65,18 +88,22 @@ <td class="normal"> <div class="normal"> + <?php if(isset($plain) && isset($_GET['load'])) { + echo html_entity_decode('<h4 class="demo-subheader">Functional demo:</h4>'); + echo html_entity_decode('<h3>'. $_GET['load'] .'</h3>'); + echo html_entity_decode('<div class="demo-config">'); + echo html_entity_decode('<iframe id="preview" name="preview" src="/'. $section .'/default.html" width="520" height="314" border="0" frameborder="0" style="overflow:auto"></iframe>'); + echo html_entity_decode('<div class="demo-config-menu">'); + include($section .'/index.html'); + echo html_entity_decode('</div>'); + echo html_entity_decode('</div>'); + } else { ?> - <?php if(isset($plain) && isset($_GET['load'])) { - echo html_entity_decode('<h3>'. $_GET['load'] .'</h3>'); - include($section .'/index.html'); - echo html_entity_decode('<iframe id="preview" name="preview" src="/'. $section .'/default.html" width="520" height="314" border="0" frameborder="0" style="overflow:auto"></iframe>'); - } else { ?> - - <h3>Instructions</h3> - <p> - These demos showcase some common uses of each jQuery UI plugin. Simply copy and paste code from the demos to get started. Have fun playing with them. - </p> - <?php } ?> + <h3>Instructions</h3> + <p> + These demos showcase some common uses of each jQuery UI plugin. Simply copy and paste code from the demos to get started. Have fun playing with them. + </p> + <?php } ?> </div> </td> |