jQuery Spoiler
Posted: 24 Jul 2010, 22:28
jQuery Spoiler
NOTE:
In order to work, this spoiler will need jQuery. If your style already has jQuery included, it will work right out of the box, otherwise you will have to do this:
Download jQuery 1.4.2 from here: http://code.jquery.com/jquery-1.4.2.min.js
Save it on your computer and upload it to the template folder of your style(s) that will use the spoiler.
If you have more than one style for your users, do this for every style:
Open styles/*yourstyle*/template/overall_header.html
Find:
Add before:
If you downloaded a different version of jQuery, please replace "jquery-1.4.2.min.js" with the filename of your jQuery.
BBCode Usage:
HTML Replacement:
Help line:
Demo:
http://www.youtube.com/watch?v=TWNyCU5AhrY
NOTE:
In order to work, this spoiler will need jQuery. If your style already has jQuery included, it will work right out of the box, otherwise you will have to do this:
Download jQuery 1.4.2 from here: http://code.jquery.com/jquery-1.4.2.min.js
Save it on your computer and upload it to the template folder of your style(s) that will use the spoiler.
If you have more than one style for your users, do this for every style:
Open styles/*yourstyle*/template/overall_header.html
Find:
Code: Select all
</head>
Code: Select all
<script src="{T_TEMPLATE_PATH}/jquery-1.4.2.min.js" type="text/javascript"></script>
BBCode Usage:
Code: Select all
[spoiler={INTTEXT}]{TEXT}[/spoiler]
Code: Select all
<dl class="codebox"><dt><a href="javascript: void(0);" onclick="var spoiler = this.parentNode.parentNode.getElementsByTagName('dd')[0]; if ( spoiler.style.display == 'none' ) { $(spoiler).slideDown(); $(spoiler).fadeIn('slow'); this.innerHTML = ' [−] {INTTEXT}'; } else { $(spoiler).slideUp(); $(spoiler).fadeOut('slow'); this.innerHTML = '[+] {INTTEXT}'; };">[+] {INTTEXT}</a></dt><dd style="display: none;">{TEXT}</dd></dl>
Code: Select all
[Spoiler="Title"] Any Text [/Spoiler]
http://www.youtube.com/watch?v=TWNyCU5AhrY