agat · April 20, 2012 07:03 · Aug 28, 2012 · Aug 28, 2012 · May 3, 2012 · Apr 20, 2012
diff --git a/jquery.micro-tabs.src.js b/jquery.micro-tabs.src.js
@@ -1,11 +1,11 @@
 $.fn.tabs = function(c) {
     this.click(function() {
-        var a = $(this)
+        var a = $(this);
 
         a.parent().add($(a.attr('href'))).
             addClass(c).
             siblings().
-            removeClass(c)
+            removeClass(c);
 
         return !1
     })

diff --git a/jquery.micro-tabs.min.js b/jquery.micro-tabs.min.js
@@ -1,2 +1,2 @@
 /* micro tabs jQuery plugin by Aleksej Romanovskij */
-$.fn.tabs=function(c){this.click(function(){var a=$(this)a.parent().add($(a.attr('href'))).addClass(c).siblings().removeClass(c)return!1})}
+$.fn.tabs=function(c){this.click(function(){var a=$(this);a.parent().add($(a.attr('href'))).addClass(c).siblings().removeClass(c);return!1})}
diff --git a/micro_tabs.html b/micro_tabs.html
@@ -97,9 +97,9 @@
     <body>
         <ul class="f-nav f-nav-tabs">
             <li class="active"><a href="#home">Home</a></li>
-            <li class=""><a href="#profile">Profile</a></li>
-            <li class=""><a href="#messages">Messages</a></li>
-            <li class=""><a href="#settings">Settings</a></li>
+            <li><a href="#profile">Profile</a></li>
+            <li><a href="#messages">Messages</a></li>
+            <li><a href="#settings">Settings</a></li>
         </ul>
         <div id="home" class="f-tab active">
             Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi bibendum aliquet lorem. Duis rhoncus bibendum eleifend.

diff --git a/jquery.micro-tabs.src.js b/jquery.micro-tabs.src.js
@@ -1,15 +1,15 @@
 $.fn.tabs = function(c) {
     this.click(function() {
-        var a = $(this);
+        var a = $(this)
 
         a.parent().add($(a.attr('href'))).
             addClass(c).
             siblings().
-            removeClass(c);
+            removeClass(c)
 
-        return;
-    });
-};
+        return !1
+    })
+}
 
 // use:
 $('.f-nav-tabs a').tabs('active');

diff --git a/jquery.micro-tabs.src.js b/jquery.micro-tabs.src.js
@@ -9,4 +9,8 @@ $.fn.tabs = function(c) {
 
         return;
     });
-};
+};
+
+// use:
+$('.f-nav-tabs a').tabs('active');
+// argument 'active' - CSS class name for active tabs elements
diff --git a/jquery.micro-tabs.min.js b/jquery.micro-tabs.min.js
@@ -0,0 +1,2 @@
+/* micro tabs jQuery plugin by Aleksej Romanovskij */
+$.fn.tabs=function(c){this.click(function(){var a=$(this)a.parent().add($(a.attr('href'))).addClass(c).siblings().removeClass(c)return!1})}
diff --git a/jquery.micro-tabs.src.js b/jquery.micro-tabs.src.js
@@ -0,0 +1,12 @@
+$.fn.tabs = function(c) {
+    this.click(function() {
+        var a = $(this);
+
+        a.parent().add($(a.attr('href'))).
+            addClass(c).
+            siblings().
+            removeClass(c);
+
+        return;
+    });
+};
diff --git a/micro_tabs.html b/micro_tabs.html
@@ -0,0 +1,117 @@
+<html>
+    <head>
+        <title>jQuery tabs plugin - jsFiddle demo</title>
+        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
+        <style type="text/css">
+            body {
+                padding: 10px;
+                font: normal 13px / 18px Arial, 'Helvetica Neue', Helvetica, sans-serif;
+                background: #fff;
+                color: #444;
+            }
+            a {
+                color: #268bd2;
+            }
+
+            .f-nav {
+                zoom: 1;
+                margin: 0 0 12px 0;
+                padding: 0;
+                position: relative;
+            }
+            .f-nav:before,
+            .f-nav:after {
+                display: table;
+                content: '';
+            }
+            .f-nav:after {
+                clear: both;
+            }
+            .f-nav > li {
+                float: left;
+                list-style: none;
+                margin: 0 18px 0 0;
+                position: relative;
+            }
+            .f-nav > li > a {
+                display: block;
+                line-height: 28px;
+                text-decoration: none;
+            }
+            .f-nav > li > a:hover {
+                color: #000;
+            }
+            .f-nav > .active a,
+            .f-nav > .active a:hover {
+                colorolor: #000;
+            }
+            .f-nav-tabs {
+                border-bottom: 1px solid #d9d9d9;
+            }
+            .f-nav-tabs > li {
+                margin: 0 6px -1px 0;
+            }
+            .f-nav-tabs > li > a {
+                border-radius: 3px 3px 0 0;
+                border-bottom: 1px solid transparent;
+                padding: 1px 10px 0;
+            }
+            .f-nav-tabs > li > a:hover {
+                background: #eee;
+                border-color: #d9d9d9;
+            }
+            .f-nav-tabs > .active a,
+            .f-nav-tabs > .active a:hover {
+                background: #fff;
+                border: 1px solid #d9d9d9;
+                border-bottom: 1px solid #fff;
+                padding: 0 10px;
+            }
+            .f-tab {
+                display: none;
+            }
+            .f-tab.active {
+                display: block;
+            }
+        </style>
+        <script type="text/javascript">
+            /* micro tabs jQuery plugin by Aleksej Romanovskij */
+            $.fn.tabs = function(c) {
+                this.click(function() {
+                    var a = $(this)
+
+                    a.parent().add($(a.attr('href'))).
+                            addClass(c).
+                            siblings().
+                            removeClass(c)
+
+                    return !1
+                })
+            }
+
+            $(function() {
+                $('.f-nav-tabs a').tabs('active');
+            });
+        </script>
+    </head>
+    <body>
+        <ul class="f-nav f-nav-tabs">
+            <li class="active"><a href="#home">Home</a></li>
+            <li class=""><a href="#profile">Profile</a></li>
+            <li class=""><a href="#messages">Messages</a></li>
+            <li class=""><a href="#settings">Settings</a></li>
+        </ul>
+        <div id="home" class="f-tab active">
+            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi bibendum aliquet lorem. Duis rhoncus bibendum eleifend.
+        </div>
+        <div id="profile" class="f-tab">
+            Aliquam arcu libero, interdum a mollis a, imperdiet eget velit. Sed porta diam sed quam semper quis semper elit convallis.
+        </div>
+        <div id="messages" class="f-tab">
+            Nulla tincidunt, sapien ultricies gravida ornare, est est lacinia lectus, eu pellentesque tellus orci eu mi.
+        </div>
+        <div id="settings" class="f-tab">
+            Donec vestibulum, erat vel vestibulum hendrerit, purus enim malesuada lorem, ut sollicitudin odio lacus sed metus.
+        </div>
+    </body>
+</html>
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,2 @@
		/* micro tabs jQuery plugin by Aleksej Romanovskij */
		$.fn.tabs=function(c){this.click(function(){var a=$(this)a.parent().add($(a.attr('href'))).addClass(c).siblings().removeClass(c)return!1})}