Author: vip
Date: Wed Feb 11 17:03:18 2009
New Revision: 10119
Modified:
livecd/kde4/html/template.html
Log:
- better approach to handle tabs
Modified: livecd/kde4/html/template.html
==============================================================================
--- livecd/kde4/html/template.html (original)
+++ livecd/kde4/html/template.html Wed Feb 11 17:03:18 2009
@@ -14,33 +14,56 @@
* LGPL, Piotr Budny vip (at) pld-linux.org 2008
*/
- function changeCurrent(current)
+ var tabs =
{
- var content = document.getElementById("feature");
- var tabs = document.getElementById("feature_menu");
- var elements = tabs.getElementsByTagName("a");
+ init: function()
+ {
+ var tabs = document.getElementById("feature_menu");
+ var elements = tabs.getElementsByTagName('a');
- for( var i = 0; i < elements.length; i++ )
+ for (i = 0; i < elements.length; i++)
+ {
+ elements[i].onclick = this.changeCurrent;
+ }
+ },
+
+ changeCurrent: function()
{
+ var tabs = document.getElementById("feature_menu");
+ var elements = tabs.getElementsByTagName("a");
+
+ for( var i = 0; i < elements.length; i++ )
+ {
var element = elements[i];
-
element.setAttribute("class", "");
element.setAttribute("className", "");
- }
+ }
+
+ this.setAttribute("class", "current");
+ this.setAttribute("className", "current");
- current.setAttribute("class", "current");
- current.setAttribute("className", "current");
-
+ loadContent(this.getAttribute("content"));
+ return;
+ }
+ };
+
+ function loadContent(id)
+ {
+ var content = document.getElementById("feature");
try{
- content.innerHTML = document.getElementById("feature" +
current.hash.replace("#", "-")).innerHTML;
- }catch (e){}
-
- return;
+ content.innerHTML =
document.getElementById(id).innerHTML;
+ }catch (e){}
+ }
+
+ function initTabs()
+ {
+ tabs.init();
+ loadContent("feature-1");
}
-->
</script>
</head>
-<body onload='changeCurrent(document.getElementById("initial"));'>
+<body onload='initTabs()'>
<div class="wrap background">
<div id="search">
<form action="">
@@ -62,9 +85,9 @@
</div>
<ul id="feature_menu">
- <li><a id="initial" class="current"
onclick="changeCurrent(this)" href="#1">DID YOU KNOW...</a></li>
- <li><a href="#2" onclick="changeCurrent(this)">ON THIS
DAY</a></li>
- <li><a href="#3" onclick="changeCurrent(this)">FEATURED
CONTENT</a></li>
+ <li><a class="current" href="#" content="feature-1">DID
YOU KNOW...</a></li>
+ <li><a href="#" content="feature-2">ON THIS DAY</a></li>
+ <li><a href="#" content="feature-3">FEATURED
CONTENT</a></li>
</ul>
<div id="feature">
_______________________________________________
pld-cvs-commit mailing list
[email protected]
http://lists.pld-linux.org/mailman/listinfo/pld-cvs-commit
