Work in progress — This wiki is an active migration / mirror of Homestar Runner Wiki and is not finished yet. Account registration and public editing are turned off until the migration is further along. For status updates, see the migration thread on the forums.

Help Duplicate tabs at bottom: Difference between revisions

From HR Wiki Twice
Jump to navigationJump to search
imported>HRWikiMirrorBot
Imported from hrwiki.org via Wayback Machine (HTML→wikitext)
 
imported>HRWikiMirrorBot
Reimported from hrwiki.org Wayback HTML→wikitext (full reconvert)
 
Line 1: Line 1:
<!-- Mirrored from Homestar Runner Wiki (hrwiki.org) via Wayback Machine; HTML converted to wikitext. Formatting may be imperfect. -->
<!-- Mirrored from Homestar Runner Wiki (hrwiki.org) via Wayback Machine -->
The following JavaScript and CSS code will add a duplicate set of page action tabs (article, discussion, edit, history, etc.) to the bottom of every page. The code for CSS2 browsers was originally taken from [[Wikipedia:WikiProject User scripts/Scripts/Duplicate tabs at bottom]], but the CSS has been updated so the tabs look right on our modified version of the MonoBook skin. The code for Internet Explorer has been copied from [[Help:User style/bottom tabs]] and has not been modified.
The following JavaScript and CSS code will add a duplicate set of page action tabs (article, discussion, edit, history, etc.) to the bottom of every page. The code for CSS2 browsers was originally taken from [[Wikipedia:WikiProject User scripts/Scripts/Duplicate tabs at bottom]], but the CSS has been updated so the tabs look right on our modified version of the MonoBook skin. The code for Internet Explorer has been copied from [[Help:User style/bottom tabs]] and has not been modified.


{| id="toc" class="wikitable toc" summary="Contents"
== CSS2 Browsers (Mozilla, Opera, Safari, etc.) ==
|-
| <div id="toctitle">


<span id="contents"></span>
=== Javascript ===
== Contents ==
 
</div>
* [#CSS2_Browsers_.28Mozilla.2C_Opera.2C_Safari.2C_etc..29 1 CSS2 Browsers (Mozilla, Opera, Safari, etc.)]
** [#Javascript 1.1 Javascript]
** [#CSS 1.2 CSS]
* [#Simpler_version_for_IE_and_others 2 Simpler version for IE and others]
** [#Javascript_2 2.1 Javascript]
** [#CSS_2 2.2 CSS]
 
|}
 
<span id="css2-browsers-mozilla-opera-safari-etc."></span>
== <span class="mw-headline"> CSS2 Browsers (Mozilla, Opera, Safari, etc.)</span> ==
 
<span id="javascript"></span>
=== <span class="mw-headline"> Javascript </span> ===


Put this code in [/wiki/Special:MyPage/monobook.js your monobook.js file].
Put this code in [/wiki/Special:MyPage/monobook.js your monobook.js file].
Line 32: Line 13:
   tabs.id = 'mytabs';
   tabs.id = 'mytabs';
   var listitems = tabs.getElementsByTagName('LI');
   var listitems = tabs.getElementsByTagName('LI');
   for (i=0;i&lt;listitems.length;i++) {
   for (i=0;i<listitems.length;i++) {
     if(listitems[i].id) listitems[i].id = 'mytabs-' + listitems[i].id;
     if(listitems[i].id) listitems[i].id = 'mytabs-' + listitems[i].id;
   }
   }
   document.getElementById('column-content').appendChild(tabs);
   document.getElementById('column-content').appendChild(tabs);
}
}
if (window.addEventListener) window.addEventListener(&quot;load&quot;,morelinks,false);
if (window.addEventListener) window.addEventListener("load",morelinks,false);
else if (window.attachEvent) window.attachEvent(&quot;onload&quot;,morelinks);</pre>
else if (window.attachEvent) window.attachEvent("onload",morelinks);
<span id="css"></span>
</pre>
=== <span class="mw-headline"> CSS </span> ===
 
=== CSS ===


And put this code in [/wiki/Special:MyPage/monobook.css your monobook.css file].
And put this code in [/wiki/Special:MyPage/monobook.css your monobook.css file].
Line 116: Line 98:
li#mytabs-ca-watch, li#mytabs-ca-unwatch, li#mytabs-ca-varlang-0, li#mytabs-ca-print {
li#mytabs-ca-watch, li#mytabs-ca-unwatch, li#mytabs-ca-varlang-0, li#mytabs-ca-print {
   margin-left: 1.6em;
   margin-left: 1.6em;
}</pre>
}
<span id="simpler-version-for-ie-and-others"></span>
</pre>
== <span class="mw-headline"> Simpler version for IE and others </span> ==
 
== Simpler version for IE and others ==


<span id="javascript-1"></span>
=== Javascript ===
=== <span class="mw-headline"> Javascript </span> ===


Put this in [/wiki/Special:MyPage/monobook.js your monobook.js file].
Put this in [/wiki/Special:MyPage/monobook.js your monobook.js file].
Line 132: Line 114:
   tabs.style.width = '100%';
   tabs.style.width = '100%';
   var listitems = tabs.getElementsByTagName('LI');
   var listitems = tabs.getElementsByTagName('LI');
   for (i=0;i&lt;listitems.length;i++) {
   for (i=0;i<listitems.length;i++) {
     if(listitems[i].id) listitems[i].id = 'mytabs-' + listitems[i].id;
     if(listitems[i].id) listitems[i].id = 'mytabs-' + listitems[i].id;
   }
   }
Line 138: Line 120:
   document.getElementById('content').appendChild(tabs);
   document.getElementById('content').appendChild(tabs);
}
}
if (window.addEventListener) window.addEventListener(&quot;load&quot;,morelinks,false);
if (window.addEventListener) window.addEventListener("load",morelinks,false);
else if (window.attachEvent) window.attachEvent(&quot;onload&quot;,morelinks);</pre>
else if (window.attachEvent) window.attachEvent("onload",morelinks);</pre>
<span id="css-1"></span>
 
=== <span class="mw-headline"> CSS </span> ===
=== CSS ===


And put this code in [/wiki/Special:MyPage/monobook.css your monobook.css file].
And put this code in [/wiki/Special:MyPage/monobook.css your monobook.css file].
Line 157: Line 139:
   border-left: 1px solid Grey;
   border-left: 1px solid Grey;
}</pre>
}</pre>
<div id="catlinks" class="catlinks">
[[Category:Help]]
 
<div id="mw-normal-catlinks">
 
[/wiki/Special:Categories Category]: <span dir="ltr">[[Category:Help|Help]]</span>
 
</div>
 
</div>



Latest revision as of 14:24, 14 July 2026

The following JavaScript and CSS code will add a duplicate set of page action tabs (article, discussion, edit, history, etc.) to the bottom of every page. The code for CSS2 browsers was originally taken from Wikipedia:WikiProject User scripts/Scripts/Duplicate tabs at bottom, but the CSS has been updated so the tabs look right on our modified version of the MonoBook skin. The code for Internet Explorer has been copied from Help:User style/bottom tabs and has not been modified.

CSS2 Browsers (Mozilla, Opera, Safari, etc.)

Javascript

Put this code in [/wiki/Special:MyPage/monobook.js your monobook.js file].

// Adds bottom tabs
function morelinks() {
  var tabs = document.getElementById('p-cactions').cloneNode(true);
  tabs.id = 'mytabs';
  var listitems = tabs.getElementsByTagName('LI');
  for (i=0;i<listitems.length;i++) {
    if(listitems[i].id) listitems[i].id = 'mytabs-' + listitems[i].id;
  }
  document.getElementById('column-content').appendChild(tabs);
}
if (window.addEventListener) window.addEventListener("load",morelinks,false);
else if (window.attachEvent) window.attachEvent("onload",morelinks);

CSS

And put this code in [/wiki/Special:MyPage/monobook.css your monobook.css file].

/* bottom tab styling (not for IE currently) */
#mytabs {
   margin: -0.4em 0 0  12em;
   white-space: nowrap;
   width: 76%;
   line-height: 1.1em;
   overflow: visible;
   background: none;
   border-collapse: collapse;
   padding: 0 0 0 1em;
   list-style: none;
   font-size: 95%;
}
#mytabs .hiddenStructure {
   display: none;
}
#mytabs ul {
   list-style: none;
}
#mytabs li {
   display: inline;
   border: 1px solid #aaa;
   border-top: none;
   padding: 0.1em 0 0.1em 0;
   margin: 0 0.3em 0 0;
   overflow: visible;
   background: #fff;
}
#mytabs li.selected {
   border-color: #fabd23;
   padding: 0.2em 0 0.1em 0;
}
#mytabs li a {
   background-color: #fff;
   color: #002bb8;
   border: none;
   padding: 0.3em 0.8em 0 0.8em;
   text-decoration: none;
   text-transform: lowercase;
   position: relative;
   z-index: 0;
   margin: 0;
}
#mytabs li.selected a {
   z-index: 3;
}
#mytabs .new a {
   color: #ba0000;
}
#mytabs li a:hover {
   z-index: 3;
   text-decoration: none;
}
#mytabs h5 {
   display: none;
}
#mytabs li.istalk {
   margin-right: 0;
}
#mytabs li.istalk a {
   padding-right: 0.5em;
}
#mytabs #mytabs-ca-addsection a {
   padding-left: 0.4em;
   padding-right: 0.4em;
}
/* offsets to distinguish the tab groups */
li#mytabs-ca-talk {
   margin-right: 1.6em;
}
li#mytabs-ca-watch, li#mytabs-ca-unwatch, li#mytabs-ca-varlang-0, li#mytabs-ca-print {
   margin-left: 1.6em;
}

Simpler version for IE and others

Javascript

Put this in [/wiki/Special:MyPage/monobook.js your monobook.js file].

function morelinks() {
  var tabs = document.getElementById('p-cactions').cloneNode(true);
  // don't use the same ids twice- replace the p-cactions id and prepend 'mytabs-' to the li's
  tabs.id = 'mytabs';
  // needs this to be set from js, it ignores the css width for some reason
  tabs.style.width = '100%';
  var listitems = tabs.getElementsByTagName('LI');
  for (i=0;i<listitems.length;i++) {
    if(listitems[i].id) listitems[i].id = 'mytabs-' + listitems[i].id;
  }
  // drop them at the bottom of the content area
  document.getElementById('content').appendChild(tabs);
}
if (window.addEventListener) window.addEventListener("load",morelinks,false);
else if (window.attachEvent) window.attachEvent("onload",morelinks);

CSS

And put this code in [/wiki/Special:MyPage/monobook.css your monobook.css file].

#mytabs { 
  width: 100%;
  font-size: smaller;
  position: static;
}
#mytabs h5 { display: none }
#mytabs ul { margin: 0; }
#mytabs li { display: inline; }
#mytabs li a {
  padding: 0 0.4em;
  border-left: 1px solid Grey;
}