Permalink
Browse files

ajax tabs

  • Loading branch information...
anthonyettinger committed Feb 21, 2012
1 parent 8d3c731 commit 52cb216f3323c89d939cc6e336863ed8123d7e91
Showing with 26 additions and 27 deletions.
  1. +1 −0 ajax/content.php
  2. +2 −1 jquery.tabbed.css
  3. +1 −1 jquery.tabbed.ie.css
  4. +22 −25 jquery.tabbed.js
View
@@ -1,5 +1,6 @@
<?php
$tab = ucfirst(filter_input(INPUT_GET, 'tab', FILTER_SANITIZE_STRING));
+sleep(1);
echo "$tab ajax content";
?>
View
@@ -1,5 +1,5 @@
/*!
- * jQuery.tabbed() v1.0.1
+ * jQuery.tabbed() v1.0.2
* https://github.com/chovy/tabbed-navigation
*
* Copyright 2012, Anthony Ettinger
@@ -19,3 +19,4 @@
.tabbed .contents { border: 1px solid black; border-radius: 5px; }
.tabbed .content { display: none; padding: 20px; }
.tabbed .content:first-child { display: block; }
+.tabbed .content.loading { background: url('img/loading.gif') no-repeat 50% 50%; }
View
@@ -1,5 +1,5 @@
/*!
- * jQuery.tabbed() v1.0.1
+ * jQuery.tabbed() v1.0.2
* https://github.com/chovy/tabbed-navigation
*
* Copyright 2012, Anthony Ettinger
View
@@ -1,5 +1,5 @@
/*!
- * jQuery.tabbed() v1.0.1
+ * jQuery.tabbed() v1.0.2
* https://github.com/chovy/tabbed-navigation
*
* Copyright 2012, Anthony Ettinger
@@ -15,49 +15,46 @@
var opts = $.extend({
}, opts);
- return this.each(function() {
- var url = [],
- obj = $(this);
-
- var tabs = $('.tabs li', obj),
- tabContents = $('.contents .content', obj);
+ var activateTab = function( tab, tabContent, tabs, tabContents ){
+ var url = tab.find('a').attr('href').split('#');
//make the first tab active
tabs.removeClass('active');
- tabs.eq(0).addClass("active");
- url = tabs.eq(0).find('a').attr('href').split('#');
+ tab.addClass("active");
//hide all but the first tab contents
tabContents.hide();
//we have a url, do ajax call
if ( url[0] ) {
- tabContents.eq(0).load(url[0]);
+ tabContent.html('');
+ tabContent.show();
+ tabContent.addClass('loading').load(url[0], function(){
+ tabContent.removeClass('loading');
+ });
+ } else {
+ tabContent.show();
}
+ };
- tabContents.eq(0).show();
+ return this.each(function() {
+ var obj = $(this);
+ var tabs = $('.tabs li', obj),
+ tabContents = $('.contents .content', obj),
+ firstTab = tabs.eq(0),
+ firstContent = tabContents.eq(0);
+
+ activateTab(firstTab, firstContent, tabs, tabContents);
//handle the tab clicks
tabs.click(function(e) {
var current = tabs.index($(this)),
- url = $(this).find('a').attr('href').split('#');
+ currentContent = tabContents.eq(current);
e.preventDefault();
- //make new tab active
- tabs.removeClass("active");
- $(this).addClass("active");
-
- //show new tab content
- tabContents.hide();
-
- //we have a url, do ajax call
- if ( url[0] ) {
- tabContents.eq(current).load(url[0]);
- }
-
- tabContents.eq(current).show();
+ activateTab( $(this), currentContent, tabs, tabContents );
});
});
}

0 comments on commit 52cb216

Please sign in to comment.