If your Sitmap looks like this normaly:
* Folder 1
- item 1.1
- item 1.2
* folder 1.1
- file 1.1.1
* folder 1.2
- file 1.2.1
* Folder 2
- item 2.1
- item 2.2
It collapses all, but the top folders on startup:
* Folder 1
* Folder 2
Each folder can be clicked, to expand and collapse from now on.
To do this with each TOC, just use another CSS selector in the jQuery
code:
<!--/*--><![CDATA[/*><!--*/
$(document).ready(
function(){
$("#text-table-of-contents ul").eq(0).find("li").each(
// ^--- and here
function(){if($(this).children().eq(0)){
$(this).css({cursor: "pointer"});
$(this).bind(
"click",
function(){
if($(this).children().eq(0).is(":visible")) $
(this).children().eq(0).slideUp(250);
else $(this).children().eq(0).slideDown(250);
return false;});}});
$("#text-table-of-contents ul").eq(0).find("ul").hide();
// ^--- and here
});
If you use correct styles, you could even create a horizontal menubar
with dropdown menus from this.
Best
Sebastian
Carsten Dominik <carsten.domi...@gmail.com> writes:
> On May 12, 2009, at 3:48 PM, Sebastian Rose wrote:
>
>>
>> jQuery is _the_ JS framework :-)
>> I use it all the time here...
>>
>>
>> I have this in my Sitemap:
>>
>> <script type="text/javascript" src="jquery-1.3.2.min.js"></script>
>> <script type="text/javascript">
>> <!--/*--><![CDATA[/*><!--*/
>> var doMenu = true;
>> $(document).ready(
>> function(){
>> $("ul").eq(0).find("li").each(
>> function(){if($(this).children().eq(0)){
>> $(this).css({cursor: "pointer"});
>> $(this).bind(
>> "click",
>> function(){
>> if($(this).children().eq(0).is(":visible")) $
>> (this).children().eq(0).slideUp(250);
>> else $(this).children().eq(0).slideDown(250);
>> return false;});}});
>> $("ul").eq(0).find("ul").hide();
>> });
>
> What does this code do? Just curious....
>
> - Carsten
>
>
>>
>>
>>
>>
>> Ian Barton <li...@manor-farm.org> writes:
>>> Yesterday on my bike ride I was listening to an old FLOSS Podcast about
>>> jQuery. There are a few things that Sebastian's org-info-js doesn't do, that
>>> I
>>> would like. Unfortunately, my knowledge of javascript is almost zero.
>>>
>>> However, the jQuery library seems to have excellent documentation. More
>>> importantly using jQuery seems to mostly protect you from trying to debug
>>> your
>>> code on lots of different browsers, since the jQuery author has already done
>>> it
>>> for you.
>>>
>>> After some experiments I cam up with the following snippets which toggle the
>>> visibility of DONE tasks and also timestamps. Hope someone finds them
>>> useful!
>>>
>>> Ian.
>>>
>>> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js
>>> "
>>> type="text/javascript"></script>
>>>
>>> <script type="text/javascript" >
>>> <!--/*--><![CDATA[/*><!--*/
>>>
>>> $(document).ready(function(){
>>>
>>> $('#toggletimestamp').click(function() {
>>> $('span.timestamp-wrapper').toggle();
>>> });
>>>
>>> $('#toggledone').click(function() {
>>> myParent = $("span.done").parent();
>>> myParent.toggle();
>>> });
>>> });
>>> /*]]>*/-->
>>> </script>
>>>
>>> You can set up a buttons to call these functions:
>>>
>>> <input type="submit"
>>> name="toggletimestamp"
>>> value="Toggle Time Stamp"
>>> id="toggletimestamp" />
>>>
>>> <input type="submit"
>>> name="toggledone"
>>> value="Toggle Done"
>>> id="toggledone" />
>>>
>>
>>
>> _______________________________________________
>> Emacs-orgmode mailing list
>> Remember: use `Reply All' to send replies to the list.
>> Emacs-orgmode@gnu.org
>> http://lists.gnu.org/mailman/listinfo/emacs-orgmode
_______________________________________________
Emacs-orgmode mailing list
Remember: use `Reply All' to send replies to the list.
Emacs-orgmode@gnu.org
http://lists.gnu.org/mailman/listinfo/emacs-orgmode
