jquery.tocify.js icon indicating copy to clipboard operation
jquery.tocify.js copied to clipboard

Support for Twitter Bootstrap 3

Open tmkinn opened this issue 12 years ago • 14 comments

Bootstrap 3 has some marvelous features that makes it the Bootstrap version to use for our web projects. Your Tocify plugin is marvelous as well, but it is not working on Bootstrap 3.

It would be wonderful if your plugin could be updated to the new Bootstrap version.

Want to back this issue? Post a bounty on it! We accept bounties via Bountysource.

tmkinn avatar Oct 16 '13 06:10 tmkinn

I'll provide support for Bootstrap 3 in the next release. Thanks for the feature request!

gfranko avatar Oct 16 '13 14:10 gfranko

I must consider optional solutions if your next release is far away. When do you think you´ll have it ready? With or without donations :)

tmkinn avatar Oct 16 '13 14:10 tmkinn

If I had a guess, I'd say it will be ready by Friday. Maybe earlier if I find some time tonight or tomorrow.

gfranko avatar Oct 16 '13 14:10 gfranko

Great! I really appreciate it!!!

tmkinn avatar Oct 16 '13 15:10 tmkinn

Not to push (yeah, right!)...any news yet?

tmkinn avatar Oct 21 '13 12:10 tmkinn

Sorry, had a busy week/weekend. I promise I will look at implementing this today =)

gfranko avatar Oct 21 '13 15:10 gfranko

No need to apologize, I understand completely. And completely look forward to look at the issue list tomorrow morning. (I'm a few hours ahead of you...)

tmkinn avatar Oct 21 '13 16:10 tmkinn

You can use the new Bootstrap 3 theme support for Tocify (currently in the dev branch) by setting the theme option to bootstrap3, like this:

$("#toc").tocify({
  theme: "bootstrap3"
});

Let me know if you have any issues!

Note: I created a new bootstrap3.html page inside of the demos folder

gfranko avatar Oct 22 '13 05:10 gfranko

Looks like it is working! Great job!

I will let you know if I discover any bugs later.

tmkinn avatar Oct 22 '13 11:10 tmkinn

@gfranko Hello Greg,

Your plugin is really promising, but have still issues with Bootstrap 3 support.

I'm working on a project that allow to give a Bootstap 2 or 3 skin to any documentation written with AsciiDoc.

While I tried to implement the stable version 1.9.0, I saw that Bootstrap3 was not yet fully supported, but I discovered this issue report. So I have a look on this dev version and see issues about highlightOnScroll feature.

First, on your demos/bootstrap3.html, there is a mistake when you mixed cdn CSS bootstrap 3.0 resource and Bootstrap 2 JS script. Be carefull !

If you change both CSS and JS lines to latest versions 3.0.3 of Bootstrap you'll see quickly the issue with highlight on scroll

<link href="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>

active css rule has a white background color and is applied on a href tag, not the li tag.

Hope this quick intro will help you. Tell me if you need more info Laurent

llaville avatar Dec 09 '13 11:12 llaville

Thanks. I think I did fix that myself, actually. I had forgot, but nice to know!

Tor Michal Kinn

Den 9. des. 2013 kl. 12:16 skrev Laurent Laville [email protected]:

@gfranko Hello Greg,

Your plugin is really promising, but have still issues with Bootstrap 3 support.

I'm working on a project that allow to give a Bootstap 2 or 3 skin to any documentation written with AsciiDoc.

While I tried to implement the stable version 1.9.0, I saw that Bootstrap3 was not yet fully supported, but I discovered this issue report. So I have a look on this dev version and see issues about highlightOnScroll feature.

First, on your demos/bootstrap3.html, there is a mistake when you mixed cdn CSS bootstrap 3.0 resource and Bootstrap 2 JS script. Be carefull !

If you change both CSS and JS lines to latest versions 3.0.3 of Bootstrap you'll see quickly the issue with highlight on scroll

active css rule has a white background color and is applied on a href tag, not the li tag.

Hope this quick intro will help you. Tell me if you need more info Laurent

— Reply to this email directly or view it on GitHub.

tmkinn avatar Dec 09 '13 11:12 tmkinn

There is an issue with the bootstrap3 demo page when resizing to 850px width.

kripper avatar Mar 14 '14 23:03 kripper

@llaville I too have the problem you describe, did you ever find a solution for bootstrap3? My only problem is the highlight on scroll, otherwise the plugin works perfect.

ghost avatar Sep 03 '14 18:09 ghost

Thx! That helped

ghost avatar Sep 09 '14 18:09 ghost