WebFX WebBoard
Message Thread:
View All Messages
Back to WebFX
 Added onshow events to each tab in the already amazing TabPane, John Hamm, March 10, 2005

Subject: Added onshow events to each tab in the already amazing TabPane From: John Hamm Date: March 10, 2005

I wanted to load each tab's content whenever it is displayed, and not load it until then.  That way, the page loads much faster.

Doing so is fairly easy, and let's you do the following:

<div class="tab-pane" id="tabPane1">
  <div class="tab-page" id="tabPage1" onshow="alert('Load away!');">
  </div>
</div>

The onshow event is triggered when the page first loads, and whenever the tab is selected.

Simply change the WebFXTabPage.prototype.show function on line 243 in tabpane.js to this:

WebFXTabPage.prototype.show = function () {
   var el = this.tab;
   var s = el.className + " selected";
   s = s.replace(/ +/g, " ");
   el.className = s;

   this.element.style.display = "block";

   // add this code below
   this.onshow = this.element.getAttribute("onshow");
   if (this.onshow == "" || this.onshow == null) return;
   if (typeof this.onshow == "string")
      this.onshow = new Function("event", this.onshow);
   this.onshow(window.event);
};




Reply
Name: 
Email: 
Subject: 

Enter your reply to this message below. HTML tags are not supported but words that start with http://, ftp:// or mailto: are converted to links.


View All Messages
Back to WebFX