Pri skriptoj

Propraj Jquery-skriptoj

Submenuo kun fokuso

Ekde 2014 ni havas sur nia paĝaro skripton, kiu ĉe fokuso sur submenuero aldonas la klason focus al la rilata ĉefa menuero. Per tio ebliĝas, ke la submenuo restas malfaldata.

Fontoteksto Javaskripto + Jquery
// Inspiriert von http://www.php.de/html-usability-und-barrierefreiheit/79348-erledigt-css-sub-menue-funktioniert-ff-chrome-nicht-aber-ie.html
function submenuo() {
$("nav#chefa li ul a").each (function () {
  var that = this;
  var link = $(that).parent('li').parent('ul').prev(''); // prev('a') geht nicht, weil die Funktion SetNavigation ja "a" durch "b" ersetzt
  $(this)
    .focusin(function () { link.addClass('focus'); })
    .focusout(function () { link.removeClass('focus'); });
});
}

Ekde la 5-a de oktobro 2016 la skripto estas pli longa, ĉar ĝi subtenas submenuerojn en teknikaj paĝoj:

Fontoteksto Javaskripto + Jquery
// Inspiriert von http://www.php.de/html-usability-und-barrierefreiheit/79348-erledigt-css-sub-menue-funktioniert-ff-chrome-nicht-aber-ie.html
function submenuo() {
$("nav#chefa li ul a").each (function () {
  var that = this;
  var link = $(that).parent('li').parent('ul').prev(''); // prev('a') geht nicht, weil die Funktion SetNavigation ja "a" durch "b" ersetzt
  $(this)
    .focusin(function () { link.addClass('focus'); })
    .focusout(function () { link.removeClass('focus'); });
});
$("#enhavo div#malchefa_t li a").each (function () {
  var that = this;
  var link = $(that).parent('li').parent('ul').prev(''); // prev('a') geht nicht, weil die Funktion SetNavigation ja "a" durch "b" ersetzt
  $(this)
    .focusin(function () { link.addClass('focus'); })
    .focusout(function () { link.removeClass('focus'); });
});
$("#enhavo footer div#malchefa_t2 li a").each (function () {
  var that = this;
  var link = $(that).parent('li').parent('ul').prev(''); // prev('a') geht nicht, weil die Funktion SetNavigation ja "a" durch "b" ersetzt
  $(this)
    .focusin(function () { link.addClass('focus'); })
    .focusout(function () { link.removeClass('focus'); });
});
}

Senligiligilo

Ekde 2014 nia paĝaro havas skripton, kiu senligiligas la aktualan menueron kaj ĉe tio anstataŭigas <a> per <b>.

Fontoteksto Javaskripto + Jquery
// Inspiriert von http://www.itworld.com/article/2832973/development/setting-an-active-menu-item-based-on-the-current-url-with-jquery.html
// und http://jsfiddle.net/DDZNz/
// Ersetzungen nach http://stackoverflow.com/questions/7093417/using-jquery-to-replace-one-tag-with-another
function setNavigation() {
    var path = window.location.pathname;
    path = path.replace(/\/$/, "");
    path = decodeURIComponent(path);
    // Bei Offline-Test den komischen Pfad entfernen, falls vorhanden
    if (path.match("/I:/retpaghoj/societo")) {
    path=path.replace("/I:/retpaghoj/societo","");
    }
        // Bei PHP-Version den Teil /evn entfernen
        if (path.match("/evn")) {
                path=path.replace("/evn","");
        }
    // Abfrage, ob path leer ist, denn das passiert online bei der deutschen Startseite
    if (path == "") {
       path = "/index.html";
    }
    //alert(path);

    // Variabeln fuer die unterschiedlichen Links
    var links = new Array();
    links[0] = "nav#chefa a";
    links[1] = "#informiloj a";
    links[2] = "html#imp #impressum a";
    //links[3] = "#malchefa a";
    //links[4] = "#malchefa2 a";
    links[3] = "footer[role=contentinfo] address a";

    for (var i in links) {
    // $("nav#chefa a").each(function () {
    $(links[i]).each(function () {
        var href = $(this).attr('href');
        // wenn href mit ../ beginnt, diese entfernen - aber nur das erste Auftreten
        if (href.match("../")) {
        href=href.replace("../","");
        }
        // Korrektur des href fuer die Informiloj im entsprechenden Verzeichnis
        if (href.match("informiloj") && i == 1)  {
        href=href.replace("informiloj","informiloj/informiloj");
        }
        // Korrektur des href fuer die einzelnen Informiloj nach Jahren
        if (href.match("verda_informilo") && i == 3) {
        var jahr = href.slice(15,19);
        href="informiloj/" + jahr + "/" + href;
        }

        // Korrektur des href fuer die einzelnen Technikseiten in Deutsch
        if (href.match("technik") && (i == 3 || i == 4)) {
        href="tekniko/" + href;
        }
        // Korrektur des href fuer die einzelnen Technikseiten in Esperanto
        else if (href.match("tekniko") && (i == 3 || i == 4)) {
        href="tekniko/" + href;
        }

        //alert(href);
        // / vor href stetzen, damit der folgende Vergleich passt
        href="/" + href;
        if (path.substring(0, href.length) === href) {
            $(this).closest('li').addClass('active');
            // Link a durch Element b ersetzen, ohne dass der Text verschwindet
            $(this).replaceWith(function(){
              // IE 7 und wohl auch aeltere brauchen eine Extrawurst.
              if (document.all && !document.querySelector) {
                 return $("<b />", {html: $(this).html()});
              }
              var replacement = $('<b>').html($(this).html());
              for (var i = 0; i < this.attributes.length; i++) {
              // Attribut href durch data-href ersetzen, weil in b kein href zulaessig ist
                 if (this.attributes[i].name == "href") {
                 replacement.attr("data-href", this.attributes[i].value);
                 }
                 else {
                 replacement.attr(this.attributes[i].name, this.attributes[i].value);
                 }
              }
              return replacement;
            });
        }
    });
    }
}

Fantoma <span>-etikedo

Jquery kreas senenhavan <span>-etikedon por subteni la trian varianton de la ŝpruchelpiloj jene:

Fontoteksto Javaskripto + Jquery
function span() {
  var elem = "<span class=\"io\"></span>";
  $("abbr[data-helpilo]").append(elem);
}

Tria ŝpruchelpilo en IE7

La 29-an de julio 2016 RP aldonis skripton por ebligi la trian varianton de ŝpruchelpiloj ankaŭ en la malnova Interreta Esplorilo 7. Ĝi ne subtenas :after nek :before kaj tial bezonas alian manieron.

Fontoteksto Javaskripto + Jquery
function tooltip() {
  //aus http://stackoverflow.com/questions/15755459/how-to-detect-ie7-and-lower-using-jquery-support
  //check for IE7
  if(navigator.appVersion.indexOf("MSIE 7.")!=-1) {
         //alert("Saluton, IE7");
         var tooltiptext = $("[data-helpilo]").attr('data-helpilo');
         //var elem='<span class="ie">' + tooltiptext + "</span>";
         //$("[data-helpilo]").append(elem).attr("class","helpilo");
         var klasse= $("[data-helpilo]").attr('class');
         var klasseneu=klasse + " helpilo";
         $("[data-helpilo]").attr("class",klasseneu);
         $("[data-helpilo] span.io").html(tooltiptext);
  }
}

La supra skripto kopias la enhavon de la atributo data-helpilo en la "fantoman" <span>-etikedon kaj aldonas la atributon class="helpilo" al la reala etikedo, tiel ke la formatoj por la unua varianto de ŝpruchelpiloj bone funkcias.

La 30-an de aŭgusto 2016 RP kreis iomete pli bonan skripton, tiel ke eĉ pli ol unu ŝpruchelpilo devus funkcii.

Fontoteksto Javaskripto + Jquery
function tooltip_neu() {
  //aus http://stackoverflow.com/questions/15755459/how-to-detect-ie7-and-lower-using-jquery-support
  //check for IE7
  if(navigator.appVersion.indexOf("MSIE 7.")!=-1) {
         //alert("Saluton, IE7");
        $("[data-helpilo]").each(function(){
         var tooltiptext = $(this).attr('data-helpilo');
         //var elem='<span class="ie">' + tooltiptext + "</span>";
         //$("[data-helpilo]").append(elem).attr("class","helpilo");
         var klasse= $(this).attr('class');
         var klasseneu=klasse + " helpilo";
         $(this).attr("class",klasseneu);
         $(this).children("span.io").html(tooltiptext);  // nach https://api.jquery.com/children/
        });
  }
}

Ligilo al alia lingva versio

Ekde la 2-a de septembro 2016 kelkaj el niaj paĝoj havas ligilon al la alilingva versio. Por ke ĝi aperu supre apud la serĉujo, la jena skripto estas uzata:

Fontoteksto Javaskripto + Jquery
function alie() {
         // Link verschieben
        // $('#search').append( $('p:has(>a#alilingve)') );
        // $('#search').insertAfter( $('p:has(>a#alilingve)') );
        // nach http://stackoverflow.com/questions/1279957/how-to-move-an-element-into-another-element 2 Antworten passen
          $('p:has(>a#alilingve)').insertAfter( $('#search') );
}

Simboloj el tiparoj ankaŭ per IE7

Ekde la 13-a de septembro 2016 eĉ funkcias simboloj el tiparoj per la malnova Interreta Esplorilo 7.

Por tio ekzistas nun sufiĉe kompleksa skripto:

Fontoteksto Javaskripto + Jquery
function icons() {
  //aus http://stackoverflow.com/questions/15755459/how-to-detect-ie7-and-lower-using-jquery-support
  //check for IE7
  if(navigator.appVersion.indexOf("MSIE 7.")!=-1) {
         $('[class^="icon-"]').each(function(){
              var klasse = $(this).attr('class');
              var klasseneu = klasse.replace("icon-","icon2-");
              //alert(klasse);
              var elem = "<span class=\"" + klasseneu + "\"></span>";
              //alert(elem);
              //$(elem).insertBefore($(this));
              $(this).prepend(elem);
              $(this).attr("class","");
              //@import url(../tiparoj/fontello/css/fontello-ie7.css);
              if (klasseneu=="icon2-css3" || klasseneu=="icon2-html5") {
                 $(this).css("background-image","none");
                 $(this).css("padding-left","0.5em");
              }
         });
         $('li:has(> .ui-icon)').css("padding-left","0.5em");
         $('footer[role="contentinfo"] figure + figure').css("width","49%");
         $('footer[role="contentinfo"] figure + figure a').css("padding-left","0.5em");
         $('[class^="ui-icon"]').each(function(){
                 var elem2 = "<b class=\"after\"></b>";
                 $(this).append(elem2);
                 //$(this).children("b.after").css("height","1.8em").css("line-height","1.8");
                 $(this).css("top","25%");
         });
         $('footer[role="contentinfo"] figure + figure li + li + li').css("background-image","none");
   }
}

Krom tio ekzistas du apartaj CSS-paĝoj por tiu foliumiloj, nome:

Pliaj Jquery-skriptoj

Ekde aŭgusto 2016 ni uzas Lightbox por niaj bildogalerioj. Ĝi ebligas, ke post klako sur unuopan bildon aperas la granda bildo kaj ligilo al antaŭa kaj sekva bildoj kaj por malaperigi la grandan bildon denove.

La skripto troviĝas en la reto sub http://lokeshdhakar.com/projects/lightbox2/. Informoj pri la permesilo legeblas sur aparta paĝo.

Kolorĉena skripto

La kolorĉena skripto povas esti enplektata je malsama maniero. Ĉe tio la unua parametro ĉiam difinas la tekston, kiu ricevu kolorĉenon kaj la dua la varianton.

Fontoteksto HTML
 <script>
 <!--
 rainbow("teksto",1);
 //-->
 </script>

La unuaj tri variantoj havas antaŭdifinitajn kolorojn, dum ke la kvara estas pli varia.

Fontoteksto HTML
 <script>
 <!--
 rainbow2("-->Saluton Maks'!<!--",2)
 //-->
 </script>

redonas

Por foliumiloj sen Ĝavaskripto aŭ kun malaktivigita Ĝavaskripto la sama teksto estu metata inter <noscript> kaj </noscript>.

Alie neniu ajn teksto estas montrata.

Sed tiu skripto ne plu estas uzataj sur nia paĝaro.