Tab Slide Out (free)

[Adendum]

The Tab Slide Out extension is now available from the main extension site - here and also from my extension demo site. The help file is also available online from the same page.

This tabbed slide out panel extension is a jQuery and CSS based tool based on William Paoli's original code.

PLEASE READ THE HELP FILE BEFORE REQUESTING SUPPORT.

Demo of the extension

[Adendum]

That's very good news. I'm a new user and think WWB7 is well put together. I would like to ask about removing a link from an image, but can't figure out how to start a new thread. Can you help on either? Much appreciated, topdrawer.

New Thread: Go to the board index, location the sub-section you are interested in (probably General Questions) and click on NEW TOPIC at the top of the page.

De-Link an image: Click on the image and from the menu bar click on the LINK image and edit the items in that pop up.

Hopefully one of the moderators will move your post and my reply to the correct area?????

[zinc]

Great stuff, but it would be good if we could pages rather than text with links for contents. It also clashes with a few j-powered objects on my site. I suspect it is the jquery version malarkey.

[Adendum]

Bendigo,

Thanks. Not sure I understand your first bit. You can use anything you want in the panel - try an inline frame?

It uses jQuery 1.4.2 plus the original authors jQuery plugin.

[zinc]

Yes an iFrame is exactly what I meant.

[Adendum]

Bendigo,

I just did a simple test page using Google as my iFrame source and it works fine.

[zinc]

How did you add the iframe? Did you use the html code?

[Adendum]

I used the button within the HTML Textbox extension

[zinc]

I see I got it now. Cheers

[jordan]

H.Moly your busy Paul another one
+TNX for your index update mail . .

[Adendum]

10/11/11 :
(a) I used my own extension for the first time since it was developed and I found it a bit confusing! So I have re-worded some of the property names and added improved descriptions together with a small enhancement to the help file (pdf).

(b) Having only realised I could do this yesterday (doh!) I have modified this extension (and all my extensions - see list below) so that the live rendering of the extension in design view is greatly improved. In many cases the design view will take on a background colour you set in the extension properties.

Updates available from the WWB extensions site and my own demo site. Remember to check out the extensions listed below.

Anything Slider
Automated ToolTip
Directory Listing
Elastic Thumbnail Menu
Image Information Panels
Image Swap Menu
Kick-Butt-Mega-Menu
Orbit Slider
Photo Info
Simple Horizontal Accordion
Slide Down Box Menu
Stacked Images

[Adendum]

For any user who has used this extension and experienced issues with the RIGHT setting I have uploaded a new demo page that shows you how to set this up. You need to use a transparent layer, set as a Sticky Layer, with an orientation of Centre - Right. You can also gain some animation using this option.

New demo page here.

[ColinM]

Nice one Paul!

Can see a few good uses for that - especially on my new site (stay tuned ) - thanks for that mate!

[Adendum]

Givi20,

OK the easiest way to get a form working inside Tabslideout is to create your form as a separate page (using a PHP extension of course). You then need to call that separate page into Tabslideout using an inline frame from the HTML TextBox extension.

I have now edited the demo page that had a dummy form and it now uses a simple comments form created by the WWB Wizard. The FORM is a page called theform.php and the extension calls that page in to an iFrame.

[Adendum]

You are welcome - let us see the finished page

[FX3D]

Hi Adendum, the "hide the ad" button at the top of your demo page is not working ?

It just gives me the index of your site ?

http://www.aditerum.co.uk/demo/TSO3/tabslideout3.html

The "X" button sends me http://www.aditerum.co.uk/demo/TSO3/ ??

Can you confirm ??

I cannot preview the bottom tab otherwise , I was looking for the "contact form inside the tabslideout" demo

thnx

[Adendum]

Oops ...had a rogue smartlink in the image. Changed (all pages). Hover will hide, click will refresh the page.

Thanks for spotting that.

[Adendum]

Drag the installed extension from the toolbar on to your page. Then double click the extension and edit the properties as required.

[sandy]

Hey Paul, just giving this extension a try and it seems to work pretty good. One thing I did find in the text editor that opens up when you select the panels content it has the option to put in links in the code. Not sure if that is not working or not available due to being a plugin, but you can't put in links to other pages in the site with it which is very handy. Again, may not be supported but figured I would let you know. Any way to put in Raw HTML?

Thanks

Sandy

[Adendum]

Sandy,

This is a 3+ year old extension so I have no idea what it's capabilities are these days. I'll have to try it out when I get back into my office later today. I wasn't designed to provide links as it is more of an informational tool but, like most things, it probably can have text links.

I'll have a qucik look in a couple of hours.

[Adendum]

Well, I lied it seems...but is was a long time ago.

I just checked and there is link capability. Using the HTML Textbox extension (that is required by Tab Slideout) you simply use the link option in that. For example the following code is what was alrerady in the first demo.

Code: Select all

<h1><font color="#000000" face="Impact">More Info?</font> </h1>
<p><font face="Trebuchet MS"><font color="#ffffff">To learn more about this extension please read the help file (.pdf). Alternatively you can visit William Paoli's </font><a href="http://www.building58.com/examples/tabSlideOut.html" target="_blank"><font color="#ff0000">original page</font></a><font color="#ffffff"> to see his script in use and read his blog page. </font></font></p>

So, like I said, anything is (and already was) possible

[sandy]

Thanks, I though I had htmlbox installed but it was the HTML Area extension. Once I installed it, worked like a champ!

Thanks for the quick help!!

Sandy

[Fender]

My hostprovider told me that the extension Tab slideout uses an old version
of jquery . I used the extensionmanger to look for a update of this extension
but it didn't show.
Are there any? Because I use this on my website.

[Adendum]

Yes it does use an older version of jQuery. Every extension I have created is using an old version of jQuery. And no, there will not be any update to a later version of jQuery.

[pajadt]

Is it possible that the extension is always forward, if used layer is always behind and can not be set forward.
Thanks

[Adendum]

You might be able to force a change to the z-index of the extension by manually editing the TSO css after you have published.

[pajadt]

Thank You,