Kategorie: Javascript

Mehrere Stylesheets nutzen / wechseln

admin Schreibe einen Kommentar

Um mehrere externe Stylesheets zu benutzen, bin man zuerst die verschiedenen CSS-Dateien im -Bereich der Seite ein:

<link rel="stylesheet" type="text/css" href="style/ff.css" title="small" />
<link rel="alternate stylesheet" type="text/css" href="style/big.css" title="big" />

Nun bindet man folgendes Javascript in die Seite ein.

function set_active_sheet(title) {
  var i, a, main;
  for(i=0; (a = document.getElementsByTagName("link")[i]); i++) {
    if(a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title")) {
      a.disabled = true;
      if(a.getAttribute("title") == title) a.disabled = false;
    }
  }
}

function get_active_sheet() {
  var i, a;
  for(i=0; (a = document.getElementsByTagName("link")[i]); i++) {
    if(a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title") && !a.disabled) return a.getAttribute("title");
  }
  return null;
}

function get_preferred_sheet() {
  var i, a;
  for(i=0; (a = document.getElementsByTagName("link")[i]); i++) {
    if(a.getAttribute("rel").indexOf("style") != -1
       && a.getAttribute("rel").indexOf("alt") == -1
       && a.getAttribute("title")
       ) return a.getAttribute("title");
  }
  return null;
}

function create_cookie(name,value,days) {
  if (days) {
    var date = new Date();
    date.setTime(date.getTime()+(days*24*60*60*1000));
    var expires = "; expires="+date.toGMTString();
  }
  else expires = "";
  document.cookie = name+"="+value+expires+"; path=/";
}

function read_cookie(name) {
  var nameEQ = name + "=";
  var ca = document.cookie.split(';');
  for(var i=0;i < ca.length;i++) {
    var c = ca[i];
    while (c.charAt(0)==' ') c = c.substring(1,c.length);
    if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
  }
  return null;
}

window.onload = function(e) {
  var cookie = read_cookie("style");
  var title = cookie ? cookie : get_preferred_sheet();
  set_active_sheet(title);
}

window.onunload = function(e) {
  var title = get_active_sheet();
  create_cookie("style", title, 365);
}

var cookie = read_cookie("style");
var title = cookie ? cookie : get_preferred_sheet();
set_active_sheet(title);

Als nächstes muss man noch Links definieren, die den Swicht des Stylesheets auslösen:

Schriftgröße rauf
Schriftgröße runter

Lösung mit jquery: qtranslate und das WordPress Menü – keine Übersetzung

admin Schreibe einen Kommentar

Das Menü unter Design->Menüs wird nicht immer korrekt bzw. gar nicht übersetzt. Hier stören sich oft die Versionen von qtranslate und WordPress. Einen kleinen Workaround konnte ich mit Javascript / JQuery erreichen, indem ich die Title-Attribute im Menüpunkt für eine zweite Sprache nutze:

// JavaScript Document
$(document).ready(function()
{
	$('#mainmenu li a').each ( function (index)
	{
		$(this).text($(this).attr("title"));
	});

})

Formular Eingaben mit Javascript prüfen

admin Schreibe einen Kommentar

Angenommen man hat ein einfaches Formular mit Name, Strasse und Mailadresse. Dann kann man mit folgendem Script die Eingabe prüfen, so dass das Formular erst dann gesendet wird, wenn die Eingaben korrekt sind:

function checkInput()
{
	var fehler = "";
	var TF = document.forms.testformular;
	var mail = TF.email.value;

	//prüfen ob Name leer ist
	if(TF.name.value == "")
	{
		fehler += "Sie muessen einen Firmennamen angeben";
	}

	//prüfen ob strasse leer ist
	if(TF.strasse.value == "")
	{
		fehler += "\nSie muessen die Strasse angeben";
	}

	//prüfen ob Mail leer ist
	if(f.email.value == "")
	{
		fehler += "\nSie muessen eine E-Mail Adresse angeben";
	}

	//prüfen ob Mail ein @ enthält
	if(mail.indexOf("@") == -1||mail.indexOf(".") == -1 )
	{
		fehler += "\nSie muessen eine gueltige E-Mail Adresse angeben";
	}

	if (fehler != "")
	{
		var fehlertext = "Folgende Fehler sind aufgetreten:\n";
		fehlertext += fehler
		alert(fehlertext)
		return false
	}
	
return true
}

Das ganze bindet man dann folgendermaßen ins Formular ein:

<form name="testformular" onSubmit="return checkInput()" method="POST" action="test.php">