Permalink
Browse files

Initial GitHub release

  • Loading branch information...
stefangabos committed Mar 24, 2013
0 parents commit 139fb85fe8800e678c67aee8524e3216c5a7a9ce
Showing with 1,940 additions and 0 deletions.
  1. +86 −0 README.md
  2. +1 −0 changelog.txt
  3. +1 −0 documentation.txt
  4. +172 −0 examples/index.html
  5. +8 −0 examples/libraries/index.html
  6. +165 −0 examples/libraries/syntaxhighlighter/LGPL-LICENSE
  7. +20 −0 examples/libraries/syntaxhighlighter/MIT-LICENSE
  8. +8 −0 examples/libraries/syntaxhighlighter/index.html
  9. +8 −0 examples/libraries/syntaxhighlighter/public/css/index.html
  10. +324 −0 examples/libraries/syntaxhighlighter/public/css/shCoreDefault.css
  11. +8 −0 examples/libraries/syntaxhighlighter/public/index.html
  12. +8 −0 examples/libraries/syntaxhighlighter/public/javascript/index.html
  13. +91 −0 examples/libraries/syntaxhighlighter/public/javascript/shBrushCss.js
  14. +52 −0 examples/libraries/syntaxhighlighter/public/javascript/shBrushJScript.js
  15. +69 −0 examples/libraries/syntaxhighlighter/public/javascript/shBrushXml.js
  16. +17 −0 examples/libraries/syntaxhighlighter/public/javascript/shCore.js
  17. +8 −0 examples/public/css/index.html
  18. +94 −0 examples/public/css/reset.css
  19. +37 −0 examples/public/css/style.css
  20. +8 −0 examples/public/index.html
  21. +9 −0 examples/public/javascript/functions.js
  22. +8 −0 examples/public/javascript/index.html
  23. +5 −0 examples/public/javascript/jquery-1.9.1.js
  24. +8 −0 index.html
  25. +165 −0 license.txt
  26. +8 −0 public/css/index.html
  27. +2 −0 public/css/zebra_accordion.css
  28. +8 −0 public/index.html
  29. +8 −0 public/javascript/index.html
  30. +1 −0 public/javascript/zebra_accordion.js
  31. +532 −0 public/javascript/zebra_accordion.src.js
  32. +1 −0 readme.txt
@@ -0,0 +1,86 @@
##Zebra_Accordion
A tiny accordion jQuery plugin
Zebra_Accordion is a tiny (2KB minified) accordion jQuery plugin. It transforms a basic definition list, without requiring any other specific markup, into a small-footprint, easily configurable, fully customizable, cross-browser accordion widget, useful for better organizing larger groups of content.
###Features:
- no additional markup required other than a basic definition list;
- appearance is easily customizable through CSS;
- works with both fixed and fluid (responsive) layouts;
- can be configured so that only a single tab can be expanded at a time, or so that all tabs may be expanded/collapsed;
- can be configured so that tabs expand on mouse over;
- when, after expanding a tab, part of its content is outside the viewport, it automatically scrolls the browser’s window so that the tab’s content is visible;
- callback functions can be used for further customizations;
- works in all major browsers (Firefox, Opera, Safari, Chrome, Internet Explorer 6+)
## Usage
First, load the latest version of jQuery either from a local source or from a CDN.
Load the Zebra_Accordion plugin
<script type="text/javascript" src="path/to/zebra_accordion.js"></script>
Load the plugin’s CSS file
<link rel="stylesheet" href="path/to/zebra_accordion.css" type="text/css">
Now, within the DOM-ready event do
$(document).ready(function() {
new $.Zebra_Accordion($('.Zebra_Accordion'));
});
###The HTML
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Zebra_Accordion Demo</title>
<link rel="stylesheet" href="path/to/zebra_accordion.css" type="text/css">
<script type="text/javascript" src="path/to/jquery-1.6.2.js"></script>
<script type="text/javascript" src="path/to/zebra_accordion.js"></script>
</head>
<body>
<dl class="Zebra_Accordion">
<dt>Lorem ipsum dolor sit amet consectetuer</dt>
<dd>
Lorem ipsum dolor sit amet consectetuer facilisis lacinia sapien ac et.
Quis hendrerit neque congue pretium iaculis justo laoreet orci elit condimentum.
Eros natoque Curabitur accumsan eget quis porttitor Sed Vestibulum amet sed.
</dd>
<dt>Lorem ipsum dolor sit amet consectetuer</dt>
<dd>
Lorem ipsum dolor sit amet consectetuer facilisis lacinia sapien ac et.
Quis hendrerit neque congue pretium iaculis justo laoreet orci elit condimentum.
Eros natoque Curabitur accumsan eget quis porttitor Sed Vestibulum amet sed.
</dd>
<dt>Lorem ipsum dolor sit amet consectetuer</dt>
<dd>
Lorem ipsum dolor sit amet consectetuer facilisis lacinia sapien ac et.
Quis hendrerit neque congue pretium iaculis justo laoreet orci elit condimentum.
Eros natoque Curabitur accumsan eget quis porttitor Sed Vestibulum amet sed.
</dd>
<dt>Lorem ipsum dolor sit amet consectetuer</dt>
<dd>
Lorem ipsum dolor sit amet consectetuer facilisis lacinia sapien ac et.
Quis hendrerit neque congue pretium iaculis justo laoreet orci elit condimentum.
Eros natoque Curabitur accumsan eget quis porttitor Sed Vestibulum amet sed.
</dd>
</dl>
</body>
</html>
###The CSS
dl.Zebra_Accordion { width: 400px; font-family: Arial, sans-serif; font-size: 12px }
dl.Zebra_Accordion dt { background: #000; color: #FFF; font-weight: bold; padding: 5px }
dl.Zebra_Accordion dd { background: #EFEFEF; padding: 15px; margin: 1px 0 }
dl.Zebra_Accordion dt.Zebra_Accordion_Expanded { background: #C40000 }
## Links
For demos, configuration options, events and methods, see the **[project's homepage](http://stefangabos.ro/jquery/zebra_accordion/)**
@@ -0,0 +1 @@
See http://stefangabos.ro/jquery/zebra-accordion/#changelog
@@ -0,0 +1 @@
See http://stefangabos.ro/jquery/zebra-accordion/#how-to-use
@@ -0,0 +1,172 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Zebra_Accordion examples</title>
<link rel="stylesheet" href="public/css/reset.css" type="text/css">
<link rel="stylesheet" href="../public/css/zebra_accordion.css" type="text/css">
<link rel="stylesheet" href="public/css/style.css" type="text/css">
<link type="text/css" rel="stylesheet" href="libraries/syntaxhighlighter/public/css/shCoreDefault.css">
<script type="text/javascript" src="public/javascript/jquery-1.9.1.js"></script>
<script type="text/javascript" src="libraries/syntaxhighlighter/public/javascript/shCore.js"></script>
<script type="text/javascript" src="libraries/syntaxhighlighter/public/javascript/shBrushJScript.js"></script>
<script type="text/javascript" src="libraries/syntaxhighlighter/public/javascript/shBrushXml.js"></script>
<script type="text/javascript" src="libraries/syntaxhighlighter/public/javascript/shBrushCSS.js"></script>
<script type="text/javascript" src="../public/javascript/zebra_accordion.js"></script>
<script type="text/javascript" src="public/javascript/functions.js"></script>
<script type="text/javascript">
SyntaxHighlighter.defaults['toolbar'] = false;
SyntaxHighlighter.all();
</script>
</head>
<body>
<div class="main-wrapper">
<h3>Zebra_Accordion Demos</h3>
<p><strong>The HTML:</strong></p>
<pre class="brush:xml">
&lt;!doctype html&gt;
&lt;html&gt;
&lt;head&gt;
&lt;meta charset="utf-8"&gt;
&lt;title&gt;Zebra_Accordion Demo&lt;/title&gt;
&lt;link rel="stylesheet" href="path/to/zebra_accordion.css" type="text/css"&gt;
&lt;script type="text/javascript" src="path/to/jquery-1.6.2.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript" src="path/to/zebra_accordion.js"&gt;&lt;/script&gt;
&lt;/head&gt;
&lt;body&gt;
&lt;dl class="Zebra_Accordion"&gt;
&lt;dt&gt;Lorem ipsum dolor sit amet consectetuer&lt;/dt&gt;
&lt;dd&gt;
Lorem ipsum dolor sit amet consectetuer facilisis lacinia sapien ac et.
Quis hendrerit neque congue pretium iaculis justo laoreet orci elit condimentum.
Eros natoque Curabitur accumsan eget quis porttitor Sed Vestibulum amet sed.
&lt;/dd&gt;
&lt;dt&gt;Lorem ipsum dolor sit amet consectetuer&lt;/dt&gt;
&lt;dd&gt;
Lorem ipsum dolor sit amet consectetuer facilisis lacinia sapien ac et.
Quis hendrerit neque congue pretium iaculis justo laoreet orci elit condimentum.
Eros natoque Curabitur accumsan eget quis porttitor Sed Vestibulum amet sed.
&lt;/dd&gt;
&lt;dt&gt;Lorem ipsum dolor sit amet consectetuer&lt;/dt&gt;
&lt;dd&gt;
Lorem ipsum dolor sit amet consectetuer facilisis lacinia sapien ac et.
Quis hendrerit neque congue pretium iaculis justo laoreet orci elit condimentum.
Eros natoque Curabitur accumsan eget quis porttitor Sed Vestibulum amet sed.
&lt;/dd&gt;
&lt;dt&gt;Lorem ipsum dolor sit amet consectetuer&lt;/dt&gt;
&lt;dd&gt;
Lorem ipsum dolor sit amet consectetuer facilisis lacinia sapien ac et.
Quis hendrerit neque congue pretium iaculis justo laoreet orci elit condimentum.
Eros natoque Curabitur accumsan eget quis porttitor Sed Vestibulum amet sed.
&lt;/dd&gt;
&lt;/dl&gt;
&lt;/body&gt;
&lt;/html&gt;
</pre>
<p><strong>The CSS:</strong></p>
<pre class="brush:css">
dl.Zebra_Accordion { width: 400px; font-family: Arial, sans-serif; font-size: 12px }
dl.Zebra_Accordion dt { background: #000; color: #FFF; font-weight: bold; padding: 5px }
dl.Zebra_Accordion dd { background: #EFEFEF; padding: 15px; margin: 1px 0 }
dl.Zebra_Accordion dt.Zebra_Accordion_Expanded { background: #C40000 }
</pre>
<p><strong>1.</strong> Basic usage</p>
<pre class="brush:js">
$(document).ready(function() {
var myAccordion = new $.Zebra_Accordion('.Zebra_Accordion');
});
</pre>
<p>Result</p>
<dl class="Zebra_Accordion" id="Zebra_Accordion1">
<dt>Lorem ipsum dolor sit amet consectetuer</dt>
<dd>
Lorem ipsum dolor sit amet consectetuer facilisis lacinia sapien ac et.
Quis hendrerit neque congue pretium iaculis justo laoreet orci elit condimentum.
Eros natoque Curabitur accumsan eget quis porttitor Sed Vestibulum amet sed.
</dd>
<dt>Lorem ipsum dolor sit amet consectetuer</dt>
<dd>
Lorem ipsum dolor sit amet consectetuer facilisis lacinia sapien ac et.
Quis hendrerit neque congue pretium iaculis justo laoreet orci elit condimentum.
Eros natoque Curabitur accumsan eget quis porttitor Sed Vestibulum amet sed.
</dd>
<dt>Lorem ipsum dolor sit amet consectetuer</dt>
<dd>
Lorem ipsum dolor sit amet consectetuer facilisis lacinia sapien ac et.
Quis hendrerit neque congue pretium iaculis justo laoreet orci elit condimentum.
Eros natoque Curabitur accumsan eget quis porttitor Sed Vestibulum amet sed.
</dd>
<dt>Lorem ipsum dolor sit amet consectetuer</dt>
<dd>
Lorem ipsum dolor sit amet consectetuer facilisis lacinia sapien ac et.
Quis hendrerit neque congue pretium iaculis justo laoreet orci elit condimentum.
Eros natoque Curabitur accumsan eget quis porttitor Sed Vestibulum amet sed.
</dd>
</dl>
<p><strong>2.</strong> All tabs can be expanded/collapsed</p>
<pre class="brush:js">
$(document).ready(function() {
var myAccordion = new $.Zebra_Accordion('.Zebra_Accordion', {
'collapsible': true
});
});
</pre>
<p>Result</p>
<dl class="Zebra_Accordion" id="Zebra_Accordion2">
<dt>Lorem ipsum dolor sit amet consectetuer</dt>
<dd>
Lorem ipsum dolor sit amet consectetuer facilisis lacinia sapien ac et.
Quis hendrerit neque congue pretium iaculis justo laoreet orci elit condimentum.
Eros natoque Curabitur accumsan eget quis porttitor Sed Vestibulum amet sed.
</dd>
<dt>Lorem ipsum dolor sit amet consectetuer</dt>
<dd>
Lorem ipsum dolor sit amet consectetuer facilisis lacinia sapien ac et.
Quis hendrerit neque congue pretium iaculis justo laoreet orci elit condimentum.
Eros natoque Curabitur accumsan eget quis porttitor Sed Vestibulum amet sed.
</dd>
<dt>Lorem ipsum dolor sit amet consectetuer</dt>
<dd>
Lorem ipsum dolor sit amet consectetuer facilisis lacinia sapien ac et.
Quis hendrerit neque congue pretium iaculis justo laoreet orci elit condimentum.
Eros natoque Curabitur accumsan eget quis porttitor Sed Vestibulum amet sed.
</dd>
<dt>Lorem ipsum dolor sit amet consectetuer</dt>
<dd>
Lorem ipsum dolor sit amet consectetuer facilisis lacinia sapien ac et.
Quis hendrerit neque congue pretium iaculis justo laoreet orci elit condimentum.
Eros natoque Curabitur accumsan eget quis porttitor Sed Vestibulum amet sed.
</dd>
</dl>
<br><br><br>
</div>
</body>
</html>
@@ -0,0 +1,8 @@
<html>
<head>
<title>403 Forbidden</title>
</head>
<body>
<p>Directory access is forbidden.</p>
</body>
</html>
Oops, something went wrong.

0 comments on commit 139fb85

Please sign in to comment.