MediaWiki:Navigation.js: Unterschied zwischen den Versionen

Zur Navigation springen Zur Suche springen
 
(17 dazwischenliegende Versionen desselben Benutzers werden nicht angezeigt)
Zeile 2: Zeile 2:
 
var cont= $( "#content" );  
 
var cont= $( "#content" );  
 
var search= $("<div id='search2'></div>").append($('#searchform'));  
 
var search= $("<div id='search2'></div>").append($('#searchform'));  
+
var fixOK = 1;
 
$('#chapters').append($(search));
 
$('#chapters').append($(search));
 
   
 
   
Zeile 8: Zeile 8:
 
     Anpassen an Browserfenster, u.a.
 
     Anpassen an Browserfenster, u.a.
 
************************************/
 
************************************/
function sizeX() {
+
var em = document.getElementById("content").appendChild(document.createElement("DIV"));
+
var toggleNav = $( "<div id='tS' title='Navigation vergößern' class='fas fa-bars'></div>" )
em.style.width = '1em';
+
  .click( function() {  $( nav ).toggleClass( 'nv_large' ); });
var normW = em.offsetWidth*80+200; // 80em+2x100px = content
+
$( nav ).append(toggleNav );
var thisW = window.innerWidth ||  document.documentElement.offsetWidth || 0;
+
var rand_abstand = (thisW > normW)? Math.round((thisW - normW)/2) : 0;
+
/*        Handys und kleine Bildschirme        */
 
+
  newRules[0].style.left = // #nv.fixed
+
function sizeX() {
  newRules[3].style.left = // #p-search.fixed
+
   
    rand_abstand+10+'px';
+
var wiW = window.innerWidth ||  document.documentElement.offsetWidth || 0;
   
+
var wiH = window.innerHeight ||  document.documentElement.offsetHeight || 0;
  var content= document.getElementById('content').style;
+
   
  var footer= document.getElementById('footer').style;
+
$( nav ).removeClass( 'nv_large' );
  var search = document.getElementById('mw-head').style;
+
    content.marginLeft =
+
if (wiW < wiH*0.7 || wiW < 940) {
    content.marginRight =
+
fixOK = 0; // fixed ausschalten
    search.marginLeft =
+
$ (cont).addClass( 'mobileeee' );  
    search.marginRight =
+
$ (nav).removeClass( 'fixed' );
    footer.marginLeft =
+
  }
    footer.marginRight =
+
else  {
    rand_abstand+'px';  
+
fixOK = 1; // fixed einschalten
 
+
$ (cont).removeClass( 'mobileeee' );  
/*
+
}
  var normW = 1024,
 
    thisW = window.innerWidth ||  document.documentElement.offsetWidth || 0,
 
    rand_abstand = (thisW > normW)? Math.round((thisW - normW)/20*2.5) : 0;
 
 
 
  document.body.style.paddingRight =
 
  document.body.style.paddingLeft =  
 
  document.getElementById("p-personal").style.marginLeft = 
 
    rand_abstand+'px';
 
 
 
  newRules[0].style.left =  // #siteNotice.fixed
 
    rand_abstand+10+'px';
 
 
 
  document.getElementById("footer").style.marginLeft = 
 
  document.getElementById("footer").style.marginRight =  
 
    -rand_abstand+'px';
 
  document.getElementById("bodyContent").style.marginRight =   
 
  document.getElementById("bodyContent").style.marginLeft =
 
      rand_abstand/2+'px';  
 
*/
 
 
}  
 
}  
  
Zeile 74: Zeile 55:
 
*****************/
 
*****************/
  
var nav = document.getElementById('nv');
+
var nav2 = document.getElementById('nv');  
var search = document.getElementById('p-search');  
 
  
function findPos(b) {  //Position von b ( = nav) ermitteln
+
function findPos(b) {  //Position von b ( = nav2) ermitteln
 
   var a = 0;
 
   var a = 0;
 
   if(b.offsetParent)
 
   if(b.offsetParent)
Zeile 84: Zeile 64:
 
   return[a];
 
   return[a];
 
}
 
}
var nvY = findPos(nav);
+
var nvY = findPos(nav2);
 +
 
 +
function fixNv() {
  
function fixNv() {
+
if (!fixOK) return; 
 
     //Scrollposition ermitteln
 
     //Scrollposition ermitteln
 
   var scrY = document.documentElement.scrollTop || // Explorer 6 Strict
 
   var scrY = document.documentElement.scrollTop || // Explorer 6 Strict
Zeile 98: Zeile 80:
 
   else if(document.body)
 
   else if(document.body)
 
     scrY = document.body.scrollTop;
 
     scrY = document.body.scrollTop;
   if(fixOK && typeof document.body.style.maxHeight != "undefined" && nav!='') // nur neuere Browser
+
   if(fixOK && typeof document.body.style.maxHeight != "undefined" && nav2!='') // nur neuere Browser
     nav.className = search.className = scrY > nvY - 16 ? "fixed" : "absolute";
+
     nav2.className = scrY > nvY - 30 ? "fixed" : "";
   else nav.className = search.className = "absolute";
+
   else nav2.className = "";
 
}
 
}
 
   //Menü stabilisieren
 
   //Menü stabilisieren
var fixOK = 1;
+
var toggleFix = $("<div title = 'Menü oben stabilisieren' id = 'tF' class='fa fa-arrow-up'></div>").click( function() { menuTop(); } );
var toggleFix =document.getElementById('chapters').appendChild(document.createElement("DIV"));
+
$( "#chapters" ).append( toggleFix );
  toggleFix.id = 'tF';
+
 
var tF_a=  toggleFix.appendChild(document.createElement("a"));
 
  tF_a.href='javascript:menuTop()';
 
  tF_a.innerHTML='↑';
 
  tF_a.title = 'Menü oben stabilisieren';
 
 
function menuTop() {
 
function menuTop() {
 
   fixOK = 0;
 
   fixOK = 0;
  fixNv();
+
$( nav).removeClass( 'fixed' );  
 
}
 
}
 
function styleNv() {
 
function styleNv() {
Zeile 118: Zeile 96:
 
   if (selflink && selflink.parentNode.parentNode.parentNode.tagName == 'LI') {
 
   if (selflink && selflink.parentNode.parentNode.parentNode.tagName == 'LI') {
 
     selflink.parentNode.parentNode.parentNode.className='self_parent';
 
     selflink.parentNode.parentNode.parentNode.className='self_parent';
 +
    //selflink.parentNode.parentNode.parentNode.className='selflink';
 
   }   
 
   }   
 
}  
 
}  
 
styleNv();
 
styleNv();
 +
 
window.onscroll = fixNv;
 
window.onscroll = fixNv;
  
 +
//Navigation Hover
 +
 +
$('#chapters div[id]').on("touchstart", function (e) {
 +
'use strict'; //satisfy code inspectors
 +
var link = $(this); //preselect the link
 +
if (link.hasClass('hover')) {
 +
  return true;
 +
}
 +
else {
 +
  $('#chapters div[id]').removeClass('hover');
 +
  link.addClass('hover');
 +
  return false; //extra, and to make sure the function has consistent return points
 +
}
 +
});
 +
 +
/*
 +
$('#chapters div[id] > ul').hide();
 +
$('#chapters div[id]').on("hover", function (e) {
 +
  e.preventDefault;
 +
  $(this).children('ul').toggle('slow');
 +
});
 +
*/
 
/*****************
 
/*****************
 
         Top Arrows
 
         Top Arrows
Zeile 137: Zeile 139:
 
                         if (h[i].offsetTop>screen.availHeight) {  
 
                         if (h[i].offsetTop>screen.availHeight) {  
 
var top= function( ) {window.scrollTo(0,0);}
 
var top= function( ) {window.scrollTo(0,0);}
var arrow = $("<a>top↑</a>").attr({  
+
var arrow = $("<a>top</a>").attr({  
 
title: "zum Seitenanfang",
 
title: "zum Seitenanfang",
 
"class": "toparrow noprint"
 
"class": "toparrow noprint"

Aktuelle Version vom 12. August 2018, 14:23 Uhr

var nav = $( "#nv" ); 
var cont= $( "#content" ); 
var search= $("<div id='search2'></div>").append($('#searchform')); 
var fixOK = 1;
$('#chapters').append($(search));
 
/***********************************
    Anpassen an Browserfenster, u.a.
************************************/
 
var toggleNav =  $( "<div id='tS' title='Navigation vergößern' class='fas fa-bars'></div>" )
  .click( function() {  $( nav ).toggleClass( 'nv_large' );  });
$( nav ).append(toggleNav );
 
/*         Handys und kleine Bildschirme        */ 
 
function sizeX() {
 
var wiW = window.innerWidth ||  document.documentElement.offsetWidth || 0;
var wiH = window.innerHeight ||  document.documentElement.offsetHeight || 0;
 
$( nav ).removeClass( 'nv_large' );
 
if (wiW < wiH*0.7 || wiW < 940) {
 fixOK = 0;  // fixed ausschalten
 $ (cont).addClass( 'mobileeee' ); 
 $ (nav).removeClass( 'fixed' ); 
 }
else  {
 fixOK = 1;  // fixed einschalten
 $ (cont).removeClass( 'mobileeee' ); 
 }
} 

function sizeY() {
	//Maße und Elemente  
  var body_height = document.getElementById("footer").offsetTop + 70,
    screen_height = window.innerHeight ||
      document.documentElement.offsetHeight
    diff = screen_height - body_height;
   // Höhe anpassen
  var spacer =  document.getElementById("catlinks")? 
   document.getElementById("catlinks").parentNode.insertBefore(document.createElement("DIV"), document.getElementById("catlinks")) :
   document.getElementById("bodyContent").appendChild( document.createElement("DIV") );
   spacer.style.paddingTop = diff > 0 ? diff +"px" : 0;	
}

sizeX();
sizeY();
window.onresize = function() { sizeX(); };
// window.onresize = function() { sizeY(); };

/*****************
         Navigation
*****************/

var nav2 = document.getElementById('nv'); 

function findPos(b) {  //Position von b ( = nav2) ermitteln
  var a = 0;
  if(b.offsetParent)
    for(a = b.offsetTop;b = b.offsetParent;)
      a += b.offsetTop;
  return[a];
}
var nvY = findPos(nav2);

function fixNv() {	 

if (!fixOK) return;  
    //Scrollposition ermitteln	
  var scrY = document.documentElement.scrollTop || // Explorer 6 Strict
	document.body.scrollTop || //all other Explorers
	self.pageYOffset ||
	0;
  if(self.pageYOffset)
    scrY = self.pageYOffset;
  else if(document.documentElement && document.documentElement.scrollTop)
    scrY = document.documentElement.scrollTop;
  else if(document.body)
    scrY = document.body.scrollTop;
  if(fixOK && typeof document.body.style.maxHeight != "undefined" && nav2!='') // nur neuere Browser
    nav2.className =  scrY > nvY - 30 ? "fixed" : "";
  else nav2.className = "";
}
   //Menü stabilisieren
var toggleFix = $("<div title = 'Menü oben stabilisieren' id = 'tF' class='fa fa-arrow-up'></div>").click( function() { menuTop(); } );
$( "#chapters" ).append( toggleFix );  

function menuTop() {
  fixOK = 0;
 $( nav).removeClass( 'fixed' ); 
}
function styleNv() {
  var selflink = document.getElementById('chapters').getElementsByTagName('STRONG')[0]||0;
  if (selflink && selflink.parentNode.parentNode.parentNode.tagName == 'LI') {
    selflink.parentNode.parentNode.parentNode.className='self_parent';
    //selflink.parentNode.parentNode.parentNode.className='selflink';
  }  
} 
styleNv();
 
window.onscroll = fixNv;

//Navigation Hover

$('#chapters div[id]').on("touchstart", function (e) {
 'use strict'; //satisfy code inspectors
 var link = $(this); //preselect the link
 if (link.hasClass('hover')) {
  return true;
 } 
 else {
  $('#chapters div[id]').removeClass('hover'); 
  link.addClass('hover'); 
  return false; //extra, and to make sure the function has consistent return points
 } 
});

/*
$('#chapters div[id] > ul').hide();
$('#chapters div[id]').on("hover", function (e) { 
  e.preventDefault;
  $(this).children('ul').toggle('slow');
});
*/
/*****************
         Top Arrows
*****************/

function PageHomeArrows()
{
        //if (!wgNamespaceNumber || wgNamespaceNumber <100) return;
        var c = document.getElementById("bodyContent") || document.getElementById("mw_content") || document.getElementById("article");
        if (!c) return;
        for (var level = 2; level <= 3; ++level) {
                var h = c.getElementsByTagName("h" + level);
                for (var i = 0; i < h.length; ++i) {
                        if (h[i].offsetTop>screen.availHeight) { 
var top= function( ) {window.scrollTo(0,0);}
var arrow = $("<a>top</a>").attr({ 
title: "zum Seitenanfang",
"class": "toparrow noprint"
}) 
$(arrow).on( "click", top);

arrow.appendTo( h[i] );
                        }
                }
        }
}
$(PageHomeArrows);