Comments on: jQuery ‘Tab Slide Out’ Plugin

By: John Congdon

John Congdon — Tue, 01 Mar 2011 18:49:51 +0000

I had not looked at these comments before. I also updated this plugin with Ajax functionality.

The one above in the comments is going to a 404 not found page. Checkout this version, it does the Ajax pull only once. This way you don’t load forms unless they are going to be used.

http://www.johncongdon.com/jquery-panel-slide-out/

By: John

John — Sat, 22 Jan 2011 18:54:27 +0000

One more FYI

If your having issues running jquery.js and jquery.min.js

load the jquery.min.js
and tab.js before the jquery.js

Example:

Also my custom.js starts with:

jQuery.noConflict();

By: John

John — Fri, 21 Jan 2011 16:27:43 +0000

Just an FYI, If you are having issues with not being able to click on your tab.. Set your z-index in the css.

Example:

.slide-out-div {
padding: 20px;
width: 250px;
background: #f2f2f2;
border: #29216d 2px solid;
z-index: 9999; /*– Added z-index –*/
}

Thank you, for sharing your work Willy.

By: Ameer

Ameer — Wed, 19 Jan 2011 11:03:51 +0000

Bug:

if slideOutOnLoad == true
tab will not close automatically!!

fix it by this code:
var slideOutOnLoad = function ()
{
slideOut();
setTimeout(slideIn, 2000);

};

By: Eddie

Eddie — Wed, 12 Jan 2011 22:18:35 +0000

I am using this plugin on my site (3 tabs @ bottom). They work fine in all browsers except Opera 11, where expanding a tab leaves a trail of lines all over the tab contents so that you cannot read them

Earlier today I happened to notice they worked fine in Opera 9; I haven’t seen how they work in 10. So somewhere in between the release of versions 9 and 11, something got chinked in Opera such that this behavior starts up.

It’s not a show-stopper as I doubt seriously my site will get a lot of Opera users, but perfectionist that I am, I would love to understand the cause and fix for this.

By: Thomas

Thomas — Thu, 18 Nov 2010 10:40:19 +0000

I figured out that Chrome makes my slide-out-div’s left position -296px, but it should be -232px, so it’s not visible. Matt has the same problem, anyone else? Does someone has a solution to this?

By: Chelsey

Chelsey — Thu, 18 Nov 2010 04:31:05 +0000

Installed this plug-in and it worked perfect, suddenly it disappeared. Could you email me for help please?

By: Thomas

Thomas — Wed, 17 Nov 2010 19:41:25 +0000

Hey, thanks for the nice plugin! One problem though, the slide-out-div isn’t visible in Chrome… It is on the first time I load the page but after a refresh it just disappears. Cleaning up history brings it back but only the first time I load the page. My Javascript is turned on and FF and IE do show it as it should be. What could be the problem?

Thanks in advance

By: Jay

Jay — Sun, 17 Oct 2010 23:05:08 +0000

Hey thanks for the nifty plugin, it works a treat! How would I go about changing the tab image upon clicking. E.g. arrows pointing right when closed to arrows pointing left when open?

Once again thanks for your hard work :o)

By: Aussie

Aussie — Fri, 20 Aug 2010 17:02:57 +0000

Great script

Add this bit of code to allow the tab to be close programmaticly

$.fn.tabSlideIn = function() {
if (settings.tabLocation === ‘top’) {
obj.animate({top:’-’ + properties.containerHeight}, settings.speed).removeClass(’open’);
} else if (settings.tabLocation === ‘left’) {
obj.animate({left: ‘-’ + properties.containerWidth}, settings.speed).removeClass(’open’);
} else if (settings.tabLocation === ‘right’) {
obj.animate({right: ‘-’ + properties.containerWidth}, settings.speed).removeClass(’open’);
} else if (settings.tabLocation === ‘bottom’) {
obj.animate({bottom: ‘-’ + properties.containerHeight}, settings.speed).removeClass(’open’);
}
};