DynTabMenu changed so the div changes it's background, instead of changing color...
authorChristian Jul Jensen <christian.jensen@typo3.org>
Tue, 14 Dec 2004 14:52:01 +0000 (14:52 +0000)
committerChristian Jul Jensen <christian.jensen@typo3.org>
Tue, 14 Dec 2004 14:52:01 +0000 (14:52 +0000)
git-svn-id: https://svn.typo3.org/TYPO3v4/Core/trunk@518 709f56b5-9817-0410-a4d7-c38de5d9e867

typo3/stylesheet.css
typo3/template.php

index 3b55829..58d432b 100755 (executable)
@@ -189,16 +189,21 @@ DIV.typo3-dyntabmenu-tabs { margin-top: 5px; padding-right: 20px; }
 DIV.typo3-dyntabmenu-divs P.c-descr { font-style : italic; padding: 3px 10px 5px 10px; background: #e7dba8;  }
 TABLE.typo3-dyntabmenu TD.tabact { color: #000; border: solid black 1px; background: #e7dba8; }
 TABLE.typo3-dyntabmenu TD.tab { color:grey; border: solid #555 1px;  background: #c4d4cd; }
-TABLE.typo3-dyntabmenu TD.disabled { color:#999999; border: solid #555 1px;  background: #cccccc; padding-left: 5px; }
-TABLE.typo3-dyntabmenu TD.tab, TABLE.typo3-dyntabmenu TD.tabact, TABLE.typo3-dyntabmenu TD.disabled { border-radius: 3px; -moz-border-radius: 3px; border-bottom: 0px; }
+TABLE.typo3-dyntabmenu TD.tab_over, TABLE.typo3-dyntabmenu TD.tabact_over, TABLE.typo3-dyntabmenu TD.disabled_over { color:#000; border: solid #555 1px;  background: #f6eab7; }
+TABLE.typo3-dyntabmenu TD.disabled { color:#999999; border: solid #555 1px;  background: #cccccc; }
+TABLE.typo3-dyntabmenu TD.tab_over, TABLE.typo3-dyntabmenu TD.tabact_over, TABLE.typo3-dyntabmenu TD.disabled_over { color:#000; border: solid #555 1px;  background: #f6eab7; }
+TABLE.typo3-dyntabmenu TD.tab, TABLE.typo3-dyntabmenu TD.tabact, TABLE.typo3-dyntabmenu TD.disabled, TABLE.typo3-dyntabmenu TD.tab_over, TABLE.typo3-dyntabmenu TD.tabact_over, TABLE.typo3-dyntabmenu TD.disabled_over  { border-radius: 3px; -moz-border-radius: 3px; border-bottom: 0px; }
 TABLE.typo3-dyntabmenu TD A { color:grey; text-decoration:none; display: block; width:100%; padding:2px; padding-left:5px; padding-right:5px; }
-TABLE.typo3-dyntabmenu TD.tabact A { color:#000; padding-left:10px; padding-right:10px; }
-TABLE.typo3-dyntabmenu TD A:hover { color:#000; background: #f6eab7; text-decoration:none; }
+TABLE.typo3-dyntabmenu TD.tabact A, TABLE.typo3-dyntabmenu TD.tab_over A { color:#000;}
+
 DIV.typo3-dyntabmenu-divs-foldout DIV.c-tablayer {margin-left: 20px;}
-DIV.typo3-dyntabmenu-divs-foldout DIV.tab { background: #c4d4cd;  background-image: url(gfx/ol/plusbullet.gif); background-repeat: no-repeat; border: solid black 1px; }
-DIV.typo3-dyntabmenu-divs-foldout DIV.tabact {  background: #e7dba8; background-image: url(gfx/ol/minusbullet.gif); background-repeat: no-repeat; border: solid black 1px;  margin-top: 5px; }
-DIV.typo3-dyntabmenu-divs-foldout DIV.disabled { color:#999999; border: solid black 1px; background: #cccccc;  padding: 2px 2px 2px 18px; }
-DIV.typo3-dyntabmenu-divs-foldout DIV.tab A, DIV.typo3-dyntabmenu-divs-foldout DIV.tabact A { text-decoration:none; display: block; padding: 2px 2px 2px 18px; }
+DIV.typo3-dyntabmenu-divs-foldout DIV.tab { background: #c4d4cd;  background-image: url(gfx/ol/plusbullet.gif); background-repeat: no-repeat; border: solid black 1px; border-radius: 3px; -moz-border-radius: 3px;}
+DIV.typo3-dyntabmenu-divs-foldout DIV.tab_over {background: #f6eab7; background-image: url(gfx/ol/arrowbullet.gif); background-repeat: no-repeat; border: solid black 1px; border-radius: 3px; -moz-border-radius: 3px;}
+DIV.typo3-dyntabmenu-divs-foldout DIV.tabact {  background: #e7dba8; background-image: url(gfx/ol/minusbullet.gif); background-repeat: no-repeat; border: solid black 1px;  margin-top: 5px; border-radius: 3px; -moz-border-radius: 3px;}
+DIV.typo3-dyntabmenu-divs-foldout DIV.tabact_over { background: #f6eab7; background-image: url(gfx/ol/arrowbullet.gif); background-repeat: no-repeat; border: solid black 1px;  margin-top: 5px; border-radius: 3px; -moz-border-radius: 3px;}
+DIV.typo3-dyntabmenu-divs-foldout DIV.disabled { color:#999999; border: solid black 1px; background: #cccccc;  padding: 2px 2px 2px 18px; border-radius: 3px; -moz-border-radius: 3px;}
+DIV.typo3-dyntabmenu-divs-foldout DIV.disabled_over { color:#999999; border: solid black 1px; background: #f6eab7;  padding: 2px 2px 2px 18px; border-radius: 3px; -moz-border-radius: 3px;}
+DIV.typo3-dyntabmenu-divs-foldout DIV.tab A, DIV.typo3-dyntabmenu-divs-foldout DIV.tabact A, DIV.typo3-dyntabmenu-divs-foldout DIV.tab_over A,DIV.typo3-dyntabmenu-divs-foldout DIV.tabact_over A { text-decoration:none; display: block; padding: 2px 2px 2px 18px;border-radius: 3px; -moz-border-radius: 3px;}
 
 
 /* Logo frame (alt_toplogo.php) */
index aa69016..27fa980 100755 (executable)
@@ -1538,10 +1538,12 @@ $str.=$this->docBodyTagBegin().
 
                                $isActive = strcmp($def['content'],'');
 
+                               $mouseOverOut = 'onmouseover="DTM_mouseOver(this);" onmouseout="DTM_mouseOut(this);"';
+
                                if (!$foldout)  {
                                                // Create TAB cell:
                                        $options[$tabRows][] = '
-                                                       <td class="'.($isActive ? 'tab' : 'disabled').'" id="'.$id.'-'.$index.'-MENU"'.$noWrap.'>'.
+                                                       <td class="'.($isActive ? 'tab' : 'disabled').'" id="'.$id.'-'.$index.'-MENU"'.$noWrap.$mouseOverOut.'>'.
                                                        ($isActive ? '<a href="#" onclick="'.htmlspecialchars($onclick).'"'.($def['linkTitle'] ? ' title="'.htmlspecialchars($def['linkTitle']).'"':'').'>' : '').
                                                        $def['icon'].
                                                        ($def['label'] ? htmlspecialchars($def['label']) : '&nbsp;').
@@ -1552,8 +1554,9 @@ $str.=$this->docBodyTagBegin().
                                } else {
                                                // Create DIV layer for content:
                                        $divs[] = '
-                                               <div class="'.($isActive ? 'tab' : 'disabled').'" id="'.$id.'-'.$index.'-MENU">'.
+                                               <div class="'.($isActive ? 'tab' : 'disabled').'" id="'.$id.'-'.$index.'-MENU"'.$mouseOverOut.'>'.
                                                        ($isActive ? '<a href="#" onclick="'.htmlspecialchars($onclick).'"'.($def['linkTitle'] ? ' title="'.htmlspecialchars($def['linkTitle']).'"':'').'>' : '').
+                                                       $def['icon'].
                                                        ($def['label'] ? htmlspecialchars($def['label']) : '&nbsp;').
                                                        ($isActive ? '</a>' : '').
                                                        '</div>';
@@ -1572,7 +1575,7 @@ $str.=$this->docBodyTagBegin().
                                        ';
                                        if ($toggle==1) {
                                                $JSinit[] = '
-                                                       if (top.DTM_currentTabs["'.$id.'-'.$index.'"]) { DTM_toggle("'.$id.'","'.$index.'"); }
+                                                       if (top.DTM_currentTabs["'.$id.'-'.$index.'"]) { DTM_toggle("'.$id.'","'.$index.'",1); }
                                                ';
                                        }
 
@@ -1611,7 +1614,6 @@ $str.=$this->docBodyTagBegin().
                                <script type="text/javascript">
                                        DTM_array["'.$id.'"] = new Array();
                                        '.implode('',$JSinit).'
-
                                        '.($toggle<=0 ? 'DTM_activate("'.$id.'", top.DTM_currentTabs["'.$id.'"]?top.DTM_currentTabs["'.$id.'"]:'.intval($defaultTabIndex).', 0);' : '').'
                                </script>
 
@@ -1632,6 +1634,7 @@ $str.=$this->docBodyTagBegin().
                        <script type="text/javascript">
                        /*<![CDATA[*/
                                var DTM_array = new Array();
+                               var DTM_origClass = new String();
 
                                function DTM_activate(idBase,index,doToogle)    {       //
                                                // Hiding all:
@@ -1657,20 +1660,40 @@ $str.=$this->docBodyTagBegin().
                                                }
                                        }
                                }
-                               function DTM_toggle(idBase,index)       {       //
+                               function DTM_toggle(idBase,index,isInit)        {       //
                                                // Showing one:
                                        if (document.getElementById(idBase+"-"+index+"-DIV"))   {
                                                if (document.getElementById(idBase+"-"+index+"-DIV").style.display == "block")  {
                                                        document.getElementById(idBase+"-"+index+"-DIV").style.display = "none";
-                                                       document.getElementById(idBase+"-"+index+"-MENU").attributes.getNamedItem("class").nodeValue = "tab";
+                                                       if(isInit) {
+                                                               document.getElementById(idBase+"-"+index+"-MENU").attributes.getNamedItem("class").nodeValue = "tab";
+                                                       } else { 
+                                                               DTM_origClass = "tab";
+                                                       }
                                                        top.DTM_currentTabs[idBase+"-"+index] = 0;
                                                } else {
                                                        document.getElementById(idBase+"-"+index+"-DIV").style.display = "block";
-                                                       document.getElementById(idBase+"-"+index+"-MENU").attributes.getNamedItem("class").nodeValue = "tabact";
+                                                       if(isInit) {
+                                                               document.getElementById(idBase+"-"+index+"-MENU").attributes.getNamedItem("class").nodeValue = "tabact";
+                                                       } else { 
+                                                               DTM_origClass = "tabact";
+                                                       }
                                                        top.DTM_currentTabs[idBase+"-"+index] = 1;
                                                }
                                        }
                                }
+
+                               function DTM_mouseOver(obj) {
+                                               DTM_origClass = obj.attributes.getNamedItem(\'class\').nodeValue;
+                                               obj.attributes.getNamedItem(\'class\').nodeValue += "_over";
+                               }
+
+                               function DTM_mouseOut(obj) {
+                                               obj.attributes.getNamedItem(\'class\').nodeValue = DTM_origClass;
+                                               DTM_origClass = "";
+                               }
+
+
                        /*]]>*/
                        </script>
                ';