Hoi
ich habe folgendes Problem:
Ich will einen Styleswitcher einbauen, mit dem man zwischen den CSS dateien wechseln kann, ich will es aber etwas ertweitern und würde gerne den Header meiner Homepage auch dabei auswechseln lassen.
Wie schaffe ich das? Ist es möglich, meinen Header per CSS einzufügen?
normalerweise geht der Code für das einfügen eines Bildes doch mit
background-image:url(img/bild.jpg);
aber der browser zeigt es trotzdem nicht an.
kann mir da jemand helfen?
LG
TimSly
ich habe folgendes Problem:
Ich will einen Styleswitcher einbauen, mit dem man zwischen den CSS dateien wechseln kann, ich will es aber etwas ertweitern und würde gerne den Header meiner Homepage auch dabei auswechseln lassen.
Wie schaffe ich das? Ist es möglich, meinen Header per CSS einzufügen?
normalerweise geht der Code für das einfügen eines Bildes doch mit
background-image:url(img/bild.jpg);
aber der browser zeigt es trotzdem nicht an.
kann mir da jemand helfen?
LG
TimSly
Das Element mit dem Hintergundbild sollte natürlich die selben Ausmaße wie das Bild haben (width, height) - bzw. mindestens diese Ausmaße (dann aber Wiederholungen und Ausrichtung des Hintergrundbildes via background-repeat und background-position anpassen)
Deinem Hilfegesuch mangelt es übrigens an Umfang und Ausführlichkeit...
Deinem Hilfegesuch mangelt es übrigens an Umfang und Ausführlichkeit...
Dass das Bild so groß sein sollte, ist mir schon klar.
und ausführlicher? gerne.
Das hier ist das Script, das ich einbauen will, das Problem ist einfach nur, dass man damit nur zwischen den CSS Dateien hin und herschaltet.
das hier ist für den Head Bereich.
und das hier ist die styles.js datei
und zu guter letzt noch die links, um zu switchen
gut, damit sind die Codes bekannt, mein Problem, wie bereits erwähnt, damit ändert man nur die CSS datei und nicht das Bild, ich bräuchte aber, damit sich der Styleswitcher eben lohnt, auch einen anderen Header.
Ausführlich genug?
LG
und ausführlicher? gerne.
Das hier ist das Script, das ich einbauen will, das Problem ist einfach nur, dass man damit nur zwischen den CSS Dateien hin und herschaltet.
<link rel="stylesheet" type="text/css" href="default.css" title="default" />
<link rel="alternate stylesheet" type="text/css" href="style2.css" title="style2" />
<link rel="alternate stylesheet" type="text/css" href="style3.css" title="style3" />
<link rel="alternate stylesheet" type="text/css" href="style4.css" title="style4" />
<script type="text/javascript" src="styles.js"></script>
das hier ist für den Head Bereich.
und das hier ist die styles.js datei
function setActiveStyleSheet(title) {
var i, a, main;
for(i=0; (a = document.getElementsByTagName("link")); i++) {
if(a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title")) {
a.disabled = true;
if(a.getAttribute("title") == title) a.disabled = false;
}
}
}
function getActiveStyleSheet() {
var i, a;
for(i=0; (a = document.getElementsByTagName("link")); i++) {
if(a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title") && !a.disabled) return a.getAttribute("title");
}
return null;
}
function getPreferredStyleSheet() {
var i, a;
for(i=0; (a = document.getElementsByTagName("link")); i++) {
if(a.getAttribute("rel").indexOf("style") != -1
&& a.getAttribute("rel").indexOf("alt") == -1
&& a.getAttribute("title")
) return a.getAttribute("title");
}
return null;
}
function createCookie(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 readCookie(name) {
var nameEQ = name + "=";
var ca = document.cookie.split(';');
for(var i=0;i < ca.length;i++) {
var c = ca;
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 = readCookie("style");
var title = cookie ? cookie : getPreferredStyleSheet();
setActiveStyleSheet(title);
}
window.onunload = function(e) {
var title = getActiveStyleSheet();
createCookie("style", title, 365);
}
var cookie = readCookie("style");
var title = cookie ? cookie : getPreferredStyleSheet();
setActiveStyleSheet(title);
und zu guter letzt noch die links, um zu switchen
<a href="#" onclick="setActiveStyleSheet('default'); return false;">Default</a>
<a href="#" onclick="setActiveStyleSheet('style2'); return false;">Style 2</a>
<a href="#" onclick="setActiveStyleSheet('style3'); return false;">Style 3</a>
<a href="#" onclick="setActiveStyleSheet('style4'); return false;">Style 4</a>
gut, damit sind die Codes bekannt, mein Problem, wie bereits erwähnt, damit ändert man nur die CSS datei und nicht das Bild, ich bräuchte aber, damit sich der Styleswitcher eben lohnt, auch einen anderen Header.
Ausführlich genug?
LG
Logge dich ein um einen Beitrag zu schreiben.