• 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
How do you make the CodeIgniter user guide 'Table of Content' tab ?

#1
[eluser]winterain[/eluser]
Can someone teach how to create that cool effect at the CI userguide where you click on the Table of Contents link and it drops down that seperate contents page ? Smile

#2
[eluser]Phil Sturgeon[/eluser]
It's just done with a jQuery effect.

#3
[eluser]bobbybaboon[/eluser]
Looks to me like they're using moo.fx. Then they run this liitle script:
Code:
window.onload = function() {
    myHeight = new fx.Height('nav', {duration: 400});
    myHeight.hide();
    }
To hide a div with an id of 'nav'

And then they have a toggle href with an onclick bit of [removed]
Code:
onclick="myHeight.toggle();

But that's just how they did it. It could be done a ton of other ways or with any other javascript library like jquery or prototype.

#4
[eluser]xwero[/eluser]
Checking the source of the user guide there is prototype.lite and moo.fx, how can say javascript library overkill Smile

#5
[eluser]winterain[/eluser]
So to put it short, it's actually loading an external html containing the contents info into the hidden div, and then animating how the hidden div shows itself right?

or are the table of contents actually loaded already when the page loads, and then simply hidden and shown on request?

I'm thinking of using something like that in subsections of a website, but I think it would be entirely SEO unfriendly, since none of the hidden/shown div contents are shown in the page markup at all...

any thoughts on this?

#6
[eluser]Adam Griffiths[/eluser]
It's funny how EL are developing a jQuery library, and they use Prototye and Mootools in the docs. Tongue

#7
[eluser]Phil Sturgeon[/eluser]
Yea assumed jQuery as I know it's a few of the dev's personal favourites. Either way the "cool effect" is all the same.

#8
[eluser]bobbybaboon[/eluser]
[quote author="winterain" date="1231456472"]So to put it short, it's actually loading an external html containing the contents info into the hidden div, and then animating how the hidden div shows itself right?

or are the table of contents actually loaded already when the page loads, and then simply hidden and shown on request?

I'm thinking of using something like that in subsections of a website, but I think it would be entirely SEO unfriendly, since none of the hidden/shown div contents are shown in the page markup at all...

any thoughts on this?[/quote]

The way they're doing it is to have it loaded from an external source, but you can easily just have the info in the div already but just hidden. That's the way I usually do it.

Here's a tutorial for jquery


Digg   Delicious   Reddit   Facebook   Twitter   StumbleUpon  


  Theme © 2014 iAndrew  
Powered By MyBB, © 2002-2021 MyBB Group.