Posted on 31 October 2007, 22:26
by ygleyzer
Location: @home
Location: @home
Code piece toggle and source download
By Nir Tzachar request, added 2 new useful features for CODE tag.- Expand/collapse toggle button for long code pieces (height ≥ 250px).
- Download highlighted source code as text file.
Enabled on
<code lang="...">tags and supports custom filename viafilename="..."attribute.
Features implemented using jQuery library. An example (actual JS code, look at right upper corner):
- $(document).ready(function(){
- $('div.code').each(function(){
- var extra = '';
- var fname = $(this).attr('filename');
- if(!fname) fname = 'code.txt';
- if(fname)
- extra += '<a onclick="get_code_source(this.parentNode.parentNode)">'+
- '<img src="images/download.gif" alt="download" title="download '+fname+'"/></a>';
- if($(this).children('.hl-main').height() > 200)
- extra += '<a onclick="toggle_code(this.parentNode.parentNode)">'+
- '<img align="top" src="images/toggle.gif" alt="toggle" title="toggle"/></a>';
- if(extra)
- $(this).prepend('<div class="small float-right no-print">'+extra+'</div>');
- });
- });