Seite wurde in: Sekunden geladen.


Jede kleine Ehrlichkeit ist besser als eine grosse Lüge.

Behandle die Menschen so, als wären sie, was sie sein sollten,und du hilfst ihnen zu werden, was sie sein können.

Gegen Angriffe kann man sich wehren, gegen Lob ist man machtlos.


NEWS - Latest News





TM-Speed: Trackmania Server Controller, ohne Mysql-Datenbank. Player und Rekorde werden local auf dem Server gespeichert. TM-Speed ist komplett in php geschrieben .... Weiterlesen





Der Text legt sich um das jeweilige Kalenderblatt herum, die Abstände vom Kalenderblatt zum Text hin nach rechts und nach unten lassen sich auch beliebig einstellen. Weiterlesen

* * * * *

* * * * *

Drehbank - Herzlich Willkommen bei xpkiller ...

Meine Drehbank FV - 1000

show intro to tabmanager


The tabManager is nothing but a JavaScript-class. Its use is fairly simple and for standard tabbed-panels doesn't even require programming knowledge. Turning some DIV-elements into tabbed-panels is no big deal; include the javascript-file, set some css-directives and initialize the tabManager. Although being such simple in implementation tabManager comes with some useful functionality.

Contrary to existing similar tools, you don't need to define a link-list of any sort to get your tabbed-panels. Adding Panels is enough to get it working. Easy, isn't it?

Unobtrusive JavaScript seems to be the new buzzword used in any other application. Unobtrusive JavaScripts are built to enhance websites if the browser accepts javascript and does not mess up the page entirely, if the browser declines javascript. It also stands for a clean cut between markup, style and functionality. In my opinion unobtrusive javascript should even go a step further; get encapsulation of the different tools right, so they don't mess up each others functionality.

the power of tabManager


For the simplest of all possibilities you can place another <div>-element around your <div>-elements. Assign an ID to the outer <div>-element and import tabManager. All (first-level) <div>-elements will be importet an automatically added to the tab-navigation.

dynamic import

It's possible to add an remove new tabs on runtime. This makes it very easy to extend your tabbed-panels as you wish. Objects already registered in DOM-tree will be set as child of tabManager.

move tabs

To get to an even higher level of versatility, tabs can be moved to other positions within a tabbed-panel. This way you can get your tabs into your favoured order.


To make tabManager usable for interactive interfaces, I added events. You can have the user confirm the switch to another tab, or initiate a HTTP-request, for example.

disable tabs

There are quite a few reasons to disable and enable a tab during runtime. If a tab is disabled, it is not possible to switch to this tab what so ever.

navigation links

Specify a link pointing to an anchor, let's say #tmNext and tabManager will make the link to switch to the next tab.


If an anchor is set to jump to, tabManager will display the corresponding tab on page load automatically.


You can define accesskeys for each tab. Especially Interfaces which will be used frequently will benefit from this.

need multiple tabbed-panels?

multiple tabbed-panels

You can create multiple autonomous tabbed-panels on the same page. tabManager doesn't use any global functions or variables, so it is perfectly fine to use multiple instances.

nested tabbed-panels

Yes! you can even nest one tabManager inside the other. There is no limit to the depth of nested tabbed-panels.

colors an things like that

tabManager's style

tabManager doesn't care about good-looking websites. Controlling style is reduced to setting css-classes. If no css is specified, the whole thing will look like the html presets.

Since using css you can have tabManager look like mostly anything you can think of. The example comes with the sliding-doors technique implemented, changing colors is trivial.

The dynamically generated tabBar can either be set to be displayed above or below the tabPanels. It's a stylesheet thing to have your tabs look nice above or below the tabPanels, or even move the tabs to the left or right of the tabPanels.

For some reasons apple's Safari needs some extra care to display tabPanels with the correct width. Because of this tabManager sets the width of the tabPanels to the width of the previously active tabPanel. In spite of this adjustment your stylesheets should work out correctly.

TOP Du bist der Besucher auf meiner Homepage!

Mail :
Home of xpkiller ©by xpkiller 2013